Javascript 如何在fineuploader中显示失败上载的取消按钮？

我正在使用fineuploader。当用户尝试上载重复文件时，某些上载可能会失败。 我看到一个红色，显示来自服务器的错误消息。 我没有看到任何“取消”或“删除”按钮允许用户通过选择新文件重新开始

我期待fineuploader在失败的文件上显示取消按钮，但事实并非如此

我可以添加onError callback，然后找到正确的行，并通过添加Remove按钮显示cancel或other按钮。这听起来很混乱

“取消”按钮将删除该文件，并允许用户选择另一个文件

我可以通过在设置中设置选项来添加此功能吗

    var fileUploader = new qq.FineUploader({
        element: $('#manual-fine-uploader')[0],
        request: {
            endpoint: 'upload/UploadFiles',                    
        },
        multiple: true,
        autoUpload: false,
        validation: {},
        text: {uploadButton: '<i class="icon-plus icon-white"></i> Select File'},
        callbacks: {
            onSubmit: function (id, file) {//my custom code },
            onCancel: function(id, file){ if(filesCount>=1) filesCount--;},
            onComplete: function (id, fileName, responseJSON) {filesCount--;}
        },
        failedUploadTextDisplay: {
            mode: 'custom',
            maxChars: 40,
            responseProperty: 'error',
            enableTooltip: true
        }
    });

---

谢谢

如果您将“自动上载”选项设置为false，则Fine Uploader仅在文件上载时以及上载开始之前显示“取消”按钮。上传完成后显示“取消”按钮似乎会让用户感到有点困惑，但我可以理解为什么您可能希望显示“删除”按钮

通过将按钮添加到模板的文件部分，可以轻松地完成此操作。例如，您的模板可能与此类似：

... ... 去除 然后，添加一个单击处理程序以从Fine Uploader的内部清除该文件&UI:

$('#manual-fine-uploader').on("click", ".remove-button-selector", function() {
    var fileId = fileUploader.getId(this);

    fileUploader.cancel(fileId);
});

最后，在onComplete处理程序中，如果上载失败，则显示按钮：

onComplete: function(id, name, response, xhr) {
    var fileItemEl = fileUploader.getItemByFileId(id);

    if (!response.success) {
        $(fileItemEl).find(".remove-button-selector").show();
    }
} 

此外，由于您已经在项目中使用jQuery，我强烈建议您使用Fine Uploader jQuery插件。这会让你的生活更轻松