JQuery AJAX 从表单发送文件数组

Question

我在某个地方找到了这段代码，可以在不刷新浏览器的情况下上传图片。然而，我不喜欢 uploader 文件，所以我决定使用我以前使用过的旧文件。问题在于它正在发送一个数组而不是来自 javascript 文件的字符串(它的目的是发送多个文件而不是仅发送一个文件)。这是创建数组的代码:

input.addEventListener("change", function (evt) {
    document.getElementById("response").innerHTML = "Loading . . ."

    var i = 0, len = this.files.length, img, reader, file;

    for ( ; i < len; i++ ) {
        file = this.files[i];
            if (formdata) {
                formdata.append("uploaded_file[]", file);
    }   }   }

    if (formdata) {
        $.ajax({
            url: "img_upload.php",
            type: "POST",
            data: formdata,
            processData: false,
            contentType: false
        }).done(function (res) {
                            /* *** show uploaded item *** */
                            /* *** show response *** */
            });
    }

我的 Javascript 知识非常薄弱，我不知道如何修改此代码以单独发送上传的文件而不是数组。

我独立尝试了这些，但没有一个起作用(send_img 是表单名称/id):

formdata = document.send_img.uploaded_file.value;
formdata = document.getElementById("uploaded_file");
formdata = new formdata ($('#send_img'));
formData = $('#send_img').serialize();
formdata.replaceWith("uploaded_file[]", file);

我还尝试消除 for 以使用相同的键 (0)，但它不起作用。img_upload.php 的精简代码是:

$fileName = $target . $_FILES["uploaded_file"]["name"];
$fileTmpLoc = $_FILES["uploaded_file"]["tmp_name"];
$fileName = $new_name .  "."  . $fileExt;
move_uploaded_file($fileTmpLoc, "images/images/temp/$fileName");

如何仅以一个字符串发送上传的文件(或 header 或应该发送的任何内容)，并且在添加第二个文件的情况下，替换第一个文件而不是在数组中创建第二个值？

Answer 1

问题不是你的逻辑，问题是文件无法通过ajax上传。

但也许你会问，别人是怎么做的？好吧，尝试一个表单插件(另一个与 jQuery 配合使用的 .js)

我为你找到了这个，它使用“提交”方法工作，但也许你可以在输入更改时进行提交，或者使用 JavaScript 操作找到其他类型的解决方案。

检查这个:http://www.miguelmanchego.com/2009/subir-archivos-usando-ajax-jquery/

网站是西类牙语，但如果您需要，请将其翻译成英语。该链接还包括一个实例和源代码下载。

问候。