問題描述

我在使用 JQuery-File-Upload 插件時遇到問題.我直接使用插件，而不是通過作者提供的 html 示例頁面.基本上我有一個帶有一些輸入的表格其中之一是文件輸入.第一次上傳工作正常，但是當我嘗試第二次上傳時，兩個文件都被發送(第一個是第二次)，而它應該只是第二個.

I have an issue using the JQuery-File-Upload plugin. I am using the plugin directly and not through the author's provided html example pages. Basically I have a form with some inputs one of which is a file input. The first upload works fine but when I attempt a second upload both files are sent (the first one for the second time) when it should only be the second one.

例子:

• 已選擇文件 1.
• 文件 1 已上傳.
• 成功.
• 使用 jquery 我使用 $(FORM_SELECTOR).trigger('reset') 重置表單
• 已選擇文件 2.
• 文件 1 和文件 2 均已上傳.
• 問題.

現在我有兩個文件 1 的副本.這不是我想要的.

Now I have two copies of file 1. This is not what I want.

顯然，如果僅能工作一次，那么使用 ajax 表單上傳并沒有多大意義，所以我認為我缺少一些東西.

Obviously there isn't much point of using an ajax form upload if it only works once so I assume that there is something I am missing.

有沒有辦法重置文件隊列?

Is there a way to reset the file queue?

檢查 data.files 對象時，我可以看到文件在表單之后被重置.我該怎么做才能將插件與輸入同步或清除 data.files.如果我手動清除 data.files 數組(通過 pop 或 data.files = [])嘗試第二次上傳不起作用.

When examining the data.files object I can see that the files are there after the form is reset. What can I do to sync the plugin with the input or clear out the data.files. If I manually clear out the data.files array (via pop or data.files = []) attempting a second upload does not work.

我這樣初始化上傳表單:

I init the upload form like this:

    $('#file-upload-form').fileupload({
    url: 'uploads/upload',
    type: 'POST',
    dataType: 'json',
    multipart: true,
    dropZone: null,
    formAcceptCharset: 'utf-8',
    autoUpload: true,
    add: function (e, data) {
        fileUploadData = data;
        $("#upload-file-btn").click(function () {
            data.submit()
                .success(function (e, status, data) {
                    console.log("success response from post", status, data);
                    var i = '<input id="file-select-input" name="files[]" multiple/>';
                    $('#file-select-input').replaceWith(i);
                })
        });
    }
});

推薦答案

我遇到了同樣的問題，我設法解決的唯一方法是在文件已上傳的情況下檢查提交回調.我只是檢查文件名是否包含在數組 fileNames 中，我在提交之前推送當前文件名，并在下一次檢查下一個文件是否存在于數組中，如果是則取消提交.

I had the same problem and the only way I've managed to solve that was to check in the submit callback if the file was already uploaded. I just check if the file name is included in the array fileNames which I push the current file name before the submission and checks on the next time if the next one is present on the array and if so cancel the submission.

var fileNames = new Array();

$('#uploadfile').fileupload({
  submit: function(e, data) ->
    var fileName = data.files[0].name;
    if ($.inArray(fileName, fileNames) === -1)
      fileNames.push(fileName);
    else
      return false;
});

這篇關于無法使用 JQuery-File-Upload 從文件列表中刪除文件的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！