使用 processData 和 contentType 时的 Ajax 响应 0。输入='文件[]'答案

【问题标题】：Ajax response 0 when using processData and contentType. Input='file[]'使用 processData 和 contentType 时的 Ajax 响应 0。输入='文件[]'
【发布时间】：2015-03-16 03:50:06
【问题描述】：

html：

<input id="fileSelect" type="file" name="files[]" multiple="multiple" accept="image/*" />

js:

alert( filesArray );
3 three images.// 
// [object File],[object File],[object File]

// new FormData object.
var formData = new FormData();
formData.append( 'files[]', filesArray );

jQuery.ajax
({
    url: ajaxurl, // uploadfile.php
    type: "POST",
    data:   {
                action: 'auto_post',
                form_data: formData
    },
    processData: false,
    contentType: false,
    success: function( data )
    {
       alert( data );
    },
    error: function( data )
    { }
});

当我不使用时：

processData: false,
contentType: false,

我得到：（错误）

TypeError: 'append' called on an object that does not implement interface FormData.

现在该怎么办？我需要使用 ajax 将 formData 发送到 php 服务器端。

上传文件.php

我需要在这里访问：

$_FILES["files"]["name"];

Ajax 数据在这里：

// Ajax Funtion.
function aap_auto_post()
{
    echo $_FILES['files']['name'];
    die();
}
add_action( 'wp_ajax_auto_post', 'aap_auto_post' );
add_action( 'wp_ajax_nopriv_auto_post', 'aap_auto_post' );

【问题讨论】：

标签： javascript php jquery ajax

【解决方案1】：

在 ajax 请求中发送的所有值都必须附加到 FormData 对象，而不仅仅是文件。此外，文件必须单独添加。

var formData = new FormData();
for (var i = 0; i < filesArray.length; i++){
    formData.append( 'files[]', filesArray[i]);
}
formData.append( 'action', 'auto_post');
...
data: formData,

【讨论】：

这是什么：formData.append( 'action', 'auto_post');
这是您要发布的操作参数
得到同样的东西：TypeError: 'append' called on an object that does not implement interface FormData.
它在jquery.1.11.js 文件中：...,d=[],e=function(a,b){b=m.isFunction(b)?b():null==b?"":b,d[d.length]=encodeURICo...
让我们continue this discussion in chat。

【解决方案2】：

使用id来选择这样的表格

$('form#YOUR_FORM_ID').submit(function(e){
 e.preventDefault();   
 var formData = new FormData($(this)[0]);
 $.ajax({
   url: 'YOUR_SERVER_URI',
   type: 'POST',
   data: formData,
   async: true,         
   success: function (data) { 
         alert(data);
   },
   cache: false,
   contentType: false,
   processData: false
   });  
      return false;

});

这将在服务器端处理 $_FILES。照常做。

【讨论】：