Question

您好我正在尝试使用AJAX上传图片，但是当我尝试使用我的文件对象附加FormData时，这里的代码无效是我的代码

var data = new FormData();
$.each(files, function(key, value){
    console.log(value);
    data.append(key, value);
    console.log(data);
});

在控制台中我得到了这个回复

File { size=1626773, type="text/comma-separated-values",    name="Prepaid_Rates_01.03.2014.csv", more...}
uploadrates.js (line 17)
FormData { append=append()}

这里你可以看到File在控制台中显示但在追加

后的数据中不可用

我也看到了这类问题，但找不到合适的答案

Answer 1

我不确定这是否会起作用。传统上，使用ajax上传文件的方法是将表单提交给隐藏的iframe，然后按以下方式给出响应：

<script type="text/javascript">window.parent.myCallback('Response Received!');</script>

因此，您需要创建一个多部分表单，将target属性设置为您的iframe名称，并将所有字段（包括文件字段）作为此表单中的表单字段，然后使用iframe，例如

<form method="post" action="/my-upload-url" target="hidden-iframe">
  Form fields here...
</form>

<iframe name="hidden-iframe"></iframe>

然后当iframe在处理完表单后加载时，会立即执行你输出的javascript作为响应，这将调用主页面中的函数myCallback，所以你也应该创建该函数：

<script type="text/javascript">
  function myCallback(message) {
    alert(message);
  }
</script>

因此，您的网页应该是：

<form method="post" action="/my-upload-url" target="hidden-iframe">
  Form fields here...
</form>

<iframe name="hidden-iframe"></iframe>

<script type="text/javascript">
  function myCallback(message) {
    alert(message);
  }
</script>

Answer 2

使用较旧的jquery版本文件并替换为最新的作业存在问题。这是旧的jquery

<script src="jquery-1.4.4.js"></script>

，新的jquery文件为：

<script src="jquery-1.11.0.min.js"></script>

我不知道这两个文件的变化，但是当我尝试最新版本时，它允许我上传文件，现在我证明最新版本更好用，并尝试使用最新版本;

FormData不能附加文件对象

2 个答案: