Jquery 和 HTML FormData 返回“未捕获的类型错误：非法调用”

Posted 2023-02-24

【中文标题】Jquery 和 HTML FormData 返回“未捕获的类型错误：非法调用”

【英文标题】：Jquery and HTML FormData returns "Uncaught TypeError: Illegal invocation"

【发布时间】：2012-09-27 04:22:07

【问题描述】：

我正在使用这个脚本来上传我的图片文件：http://jsfiddle.net/eHmSr/

$('.uploader input:file').on('change', function() 
  $this = $(this);

  $('.alert').remove();

  $.each($this[0].files, function(key, file) 
    $('.files').append('<li>' + file.name + '</li>');

    data = new FormData();
    data.append(file.name, file);

    $.ajax(
      url: $('.uploader').attr('action'),
      type: 'POST',
      dataType: 'json',
      data: data
    );
  );
);

但是当我点击上传按钮时，javascript 控制台返回此错误：

Uncaught TypeError: Illegal invocation 

你能帮帮我吗？

【问题讨论】：

你确定吗？ dataType: 'json',???

是的，网址会以这种格式返回。

在我的例子中，我想将一个文件作为更大数据集的一部分提交给 .NET MVC 控制器，该控制器接受一个序列化对象作为其操作的参数。正如lilalinux 所建议的那样，有必要使用一个FormData 对象，以及Blender 所建议的processData: false，正如Caio Tarifa 所建议的那样，还有 contentType: false 所建议的那样。任何小于所有三个的东西都不起作用。见[这个答案](***.com/a/3

【参考方案1】：

jQuery 处理data 属性并将值转换为字符串。

Adding processData: false 到您的选项对象修复错误，但我不确定它是否修复了问题。

演示：http://jsfiddle.net/eHmSr/1/

【讨论】：

谢谢，但我需要删除此属性，请参阅此问题：***.com/questions/12431760/…。

我修复了它，只需添加contentType: false。再次感谢！

@Blender 这个相同的代码在我的系统中运行，但在我的朋友（都使用 Windows 10）中运行，文件未发布。控制台中没有错误。

就我而言，问题是我使用了 var data = ;但是，您必须使用 var data = new FormData();

我无法弄清楚为什么这不起作用......直到我意识到这个过程是用一个 c 拼写的，而不是两个。

【参考方案2】：

我遇到了同样的问题

我通过使用两个选项解决了这个问题

contentType: false
processData: false

实际上我将这两个命令添加到我的 $.ajax() 函数中

【讨论】：

这些可以和$.post一起使用吗？如果有怎么办？？

【参考方案3】：

将processData: false 添加到$.ajax 选项将解决此问题。

【参考方案4】：

我的经验：

  var text = $('#myInputField');  
  var myObj = title: 'Some title', content: text;  
  $.post(myUrl, myObj, callback);

问题是我忘记将 .val() 添加到 $('#myInputField'); 的末尾。此操作让我浪费时间试图找出问题所在，导致非法调用错误，因为 $('#myInputField') 与系统指出的文件不同输出不正确的代码。希望这个答案能帮助遇到同样错误的人避免浪费时间。

【参考方案5】：

在我的情况下，参数列表中存在错误，格式不正确。 因此，请确保参数格式正确。 例如正确的参数格式

data: 'reporter': reporter,'partner': partner,'product': product