从Safari 5 / Firefox 4开始,最容易使用
FormData该类:
var data = new FormData();jQuery.each(jQuery('#file')[0].files, function(i, file) { data.append('file-'+i, file);});因此,现在您有了一个
FormData对象,准备与XMLHttpRequest一起发送。
jQuery.ajax({ url: 'php/upload.php', data: data, cache: false, contentType: false, processdata: false, method: 'POST', type: 'POST', // For jQuery < 1.9 success: function(data){ alert(data); }});必须将
contentType选项设置为
false,强制jQuery不
Content-Type为您添加标题,否则,边界字符串将丢失。另外,必须将
processData标志设置为false,否则jQuery将尝试将您
FormData转换为字符串,这将失败。
您现在可以使用以下方式在PHP中检索文件:
$_FILES['file-0']
(
file-0除非您
multiple在文件输入中指定了属性,否则只有一个文件,在这种情况下,数字将随每个文件递增。)
对较旧的浏览器 使用FormData仿真
var opts = { url: 'php/upload.php', data: data, cache: false, contentType: false, processdata: false, method: 'POST', type: 'POST', // For jQuery < 1.9 success: function(data){ alert(data); }};if(data.fake) { // Make sure no text encoding stuff is done by xhr opts.xhr = function() { var xhr = jQuery.ajaxSettings.xhr(); xhr.send = xhr.sendAsBinary; return xhr; } opts.contentType = "multipart/form-data; boundary="+data.boundary; opts.data = data.toString();}jQuery.ajax(opts);从现有表单创建FormData
除了手动迭代文件,还可以使用现有表单对象的内容来创建FormData对象:
var data = new FormData(jQuery('form')[0]);使用PHP本机数组而不是计数器
只需将文件元素命名为相同,并在方括号中加上名称即可:
jQuery.each(jQuery('#file')[0].files, function(i, file) { data.append('file[]', file);});$_FILES['file']然后将是一个数组,其中包含每个上载文件的文件上载字段。实际上,我建议在我最初的解决方案中使用此方法,因为它更容易迭代。



