jquery 文件上传 触发两次_jQuery文件上传：是否可以通过提交按钮触发上传？

以下是使用按钮实现文件上传的方法：

这是按钮：

Save这是输入元素：

这是SaveInfo()函数：

//use this function to save Info with Attached file

function SaveInfo() {

// setup our wp ajax URL

var action_url = document.location.protocol + '//' + document.location.host + '/SaveInfo';

$('body').addClass('waiting');

//get the file(s)

var filesList = $('input[type="file"]').prop('files');

//Initialize the file uploader

$('#Editor').fileupload(); //Editor is the Id of the form

//Along with file, this call internally sends all of the form data!!!

$('#Editor').fileupload('add', {

files: filesList,

url: action_url

})

$('#Editor').bind('fileuploaddone', function (e, data) {

e.preventDefault(); //stop default behaviour!

if (data.result.status == 1) { //saved!

//do something useful here...

}

$('body').removeClass('waiting');

});

// Callback for failed (abort or error) uploads:

$('#Editor').bind('fileuploadfail', function (e, data) {

e.preventDefault(); //stop default behaviour!

$('body').removeClass('waiting');

});

}注意：

它可能不是很优雅，但它对我有用。

这也将表单中的所有字段发送到服务器。

如果文件也被上传，这将仅发送表单中的字段。如果文件不存在，则不会将表单数据发送到服务器！虽然我没有用多个文件测试它，但是这个方法也可以扩展为多个文件。当我尝试它时，我会用信息更新这篇文章。