jqXHR.abort 不是函数答案

【问题标题】：jqXHR.abort is not a functionjqXHR.abort 不是函数
【发布时间】：2023-03-17 11:52:01
【问题描述】：

我正在尝试为 jquery 文件上传 (http://blueimp.github.io/jQuery-File-Upload/) 设置取消按钮。

我的代码：

var jqXHR = $('#fileupload').fileupload({
url: 'server/index.php',
dataType: 'json',
dropZone: $('#dropzone'),
})

$('button.cancel').click(function (e) {
    jqXHR.abort();
    alert("cancel");
});

当我单击取消按钮时，取消按钮不起作用，并且出现“jqXHR.abort is not a function”错误。

我需要做什么才能让取消按钮取消文件上传工作？

【问题讨论】：

标签： jquery jquery-file-upload

【解决方案1】：

根据文档，应该这样做。

var jqXHR = null;
$('#fileupload').fileupload({
    url: 'server/index.php',
    dataType: 'json',
    dropZone: $('#dropzone'),
    add: function (e, data) {
        jqXHR = data.submit();
    }
});

现在你可以像这样访问 jqXHR 对象了

$('button.cancel').click(function (e) {
    jqXHR.abort();
});

对于多次中止，方法将是这个

$('#fileupload').fileupload({
    add: function(e, data) {
         $('.progress_bar_wrapper').append($('.progress_context:first').clone());
        data.context = $('.progress_context:last');
        data.content.find('.abort').click(abortUpload );
        var xhr = data.submit();
        data.context.data('data',{jqXHR: xhr}); // so much data...
    }
)};

function abortUpload (e) {
     e.preventDefault();
     var template = $(e.currentTarget).closest('.template-upload'),
     data = template.data('data') || {}; // data, data , data (queue Monty Python skit)
      if (!data.jqXHR) {
        data.errorThrown = 'abort';
        this._trigger('fail', e, data);
      } else {
        data.jqXHR.abort();
      }
}

参考：https://github.com/blueimp/jQuery-File-Upload/issues/290

【讨论】：

感谢您的回答。但是在我像您的示例一样将jqXHR = data.submit(); 添加到添加部分之后，它会绕过图像调整大小功能。那么，如果我想让图像调整大小功能起作用，我应该把jqXHR = data.submit();放在哪里？
是的，但不起作用。它给了我Error: cannot call methods on fileupload prior to initialization; attempted to call method 'send' 消息

【解决方案2】：

正如document API 所述，您应该使用send 方法取回jqXHR。这对你有用

var jqXHR = $('#fileupload').fileupload('send', {
    url: 'server/index.php',
    dataType: 'json',
    dropZone: $('#dropzone'),
});

$('button.cancel').click(function (e) {
    jqXHR.abort();
    alert("cancel");
});

【讨论】：