我正在尝试使用新的HTML5 Multiple属性在jQuery中实现多图片上传器。

我的代码如下:

<form action="file-upload.php" method="post" enctype="multipart/form-data">
    <input name="userfiles" type="file" multiple="multiple">
</form>


我正在使用的JS代码来自SO的讨论,内容如下:

 $('input[name=userfiles]').change(function() {
    var names = [];
    for (var i = 0; i < $(this).get(0).files.length; ++i) {
        names.push($(this).get(0).files[i].name);
        console.log(names[i]);
    }
 });


这样我就可以在控制台上打印我选择的文件名,但是如果我需要获取这些文件的确切val()怎么办?我尝试用.val()替换.name,但是出现错误。

我想如果我希望能够使用$ .ajax与每个文件一起使用,则每个文件都需要一个falsepath。如果这是正确的,我如何在发送get请求的PHP文件中循环浏览它们,以便上传它们?

最佳答案

您可以使用HTML5 FormData API。 https://developer.mozilla.org/en-US/docs/Web/Guide/Using_FormData_Objects

var form = new FormData();
for (var i = 0; i < $(this).get(0).files.length; ++i) {
    form.append('userfiles[]', $(this).get(0).files[i]);
}

// send form data with ajax
$.ajax({
    url: 'url',
    type: "POST",
    data: form
});


或者,如果您不能使用FormData,可以使用一种本地发送的方式:
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files

关于javascript - jQuery从头开始上传多个文件,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/28718621/

10-09 16:03
查看更多