我正在尝试为
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不是一个功能”错误.
取消按钮取消文件上传工作需要做什么?
解决方法
根据文档,它应该这样做.
var jqXHR = null;
$('#fileupload').fileupload({
url: 'server/index.PHP',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