JQuery：ajax 请求中的“Uncaught TypeError: Illegal invocation” - 几个元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11071100/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery: 'Uncaught TypeError: Illegal invocation' at ajax request - several elements
提问by Nadir Sampaoli
I have two select elements, A and B: when A's selected option changes, B's options must be updated accordingly. Each element in A implies many elements in B, it's a one-to-many relationship (A contains nations, B should contain cities located in the given nation).
我有两个选择元素，A 和 B：当 A 的选定选项发生变化时，B 的选项必须相应地更新。A 中的每个元素都意味着 B 中的许多元素，这是一对多的关系（A 包含国家，B 应包含位于给定国家的城市）。
The function do_ajaxshould run the asynchronous request:
该函数do_ajax应该运行异步请求：
function do_ajax(elem, mydata, filename)
{
$.ajax({
url: filename,
context: elem,
data: mydata,
datatype: "html",
success: function (data, textStatus, xhr) {
elem.innerHTML = data;
}
});
}
In order to update B's options I've added a function call in A's onChangeevent. Here is the function that runs when onChange event (of A) is triggered:
为了更新 B 的选项，我在 A 的onChange事件中添加了一个函数调用。这是在A触发onChange 事件 (of )时运行的函数：
function my_onchange(e) // "e" is element "A"
{
var sel_B = ... ; // get select element "B"
// I skipped some code here
// ...
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};
do_ajax(city_sel, data, 'ajax_handler.php');
}
}
}
I've read in JQuery docsthat datacan be an array (key value pairs). I get the error if I put:
我读过JQuery 文档，它data可以是一个数组（键值对）。如果我输入，我会收到错误：
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};
Instead, I don't get that error if my data is a string:
相反，如果我的数据是字符串，则不会出现该错误：
var data = 'mode=filter_city&id_A=' + e[e.selectedIndex];
But I need the "array version" of the variable, in my server-side php code.
但是我需要在我的服务器端 php 代码中使用变量的“数组版本”。
The Uncaught TypeError: Illegal invocationis located in the "jquery-1.7.2.min.js" file, which is all compressed, so I couldn't figure out what part of code raised the error.
在Uncaught TypeError: Illegal invocation位于“jQuery的1.7.2.min.js”的文件，这是所有的压缩，所以我无法弄清楚哪些代码部分提出的错误。
Is there any setting I can change in my code so that it accepts data as an associative array?
我可以在我的代码中更改任何设置，以便它接受数据作为关联数组吗？
回答by Nadir Sampaoli
Thanks to the talk with Sarfrazwe could figure out the solution.
感谢与Sarfraz的交谈，我们可以找到解决方案。
The problem was that I was passing an HTML element instead of its value, which is actually what I wanted to do (in fact in my php code I need that value as a foreign key for querying my citiestable and filter correct entries).
问题是我传递了一个 HTML 元素而不是它的值，这实际上是我想要做的（实际上在我的 php 代码中，我需要该值作为外键来查询我的cities表并过滤正确的条目）。
So, instead of:
所以，而不是：
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};
it should be:
它应该是：
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex].value
};
Note:check Jason Kulatunga's answer, it quotes JQuery doc to explain why passing an HTML element was causing troubles.
注意：检查 Jason Kulatunga 的回答，它引用了 JQuery 文档来解释为什么传递 HTML 元素会导致麻烦。
回答by Jason Kulatunga
From the jQuery docs for processData:
来自 jQuery 文档processData：
processDataBoolean
Default: true
By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.
processDataBoolean
默认值：true
默认情况下，作为对象（技术上，除字符串以外的任何内容）传入数据选项的数据将被处理并转换为查询字符串，适合默认的内容类型“application/x-www” -form-urlencoded”。如果要发送 DOMDocument 或其他未处理的数据，请将此选项设置为 false。
Source: http://api.jquery.com/jquery.ajax
来源：http: //api.jquery.com/jquery.ajax
Looks like you are going to have to use processDatato send your data to the server, or modify your php script to support querystring encoded parameters.
看起来您将不得不使用processData将数据发送到服务器，或者修改您的 php 脚本以支持查询字符串编码的参数。
回答by Mike Volmar
I was getting this error while posting a FormData object because I was not setting up the ajax call correctly. Setup below fixed my issue.
我在发布 FormData 对象时收到此错误，因为我没有正确设置 ajax 调用。下面的设置解决了我的问题。
var myformData = new FormData();
myformData.append('leadid', $("#leadid").val());
myformData.append('date', $(this).val());
myformData.append('time', $(e.target).prev().val());
$.ajax({
method: 'post',
processData: false,
contentType: false,
cache: false,
data: myformData,
enctype: 'multipart/form-data',
url: 'include/ajax.php',
success: function (response) {
$("#subform").html(response).delay(4000).hide(1);
}
});
回答by Sarfraz
I've read in JQuery docs that data can be an array (key value pairs). I get the error if I put:
我在 JQuery 文档中读到数据可以是一个数组（键值对）。如果我输入，我会收到错误：
This is object not an array:
这是对象而不是数组：
var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};
You probably want:
你可能想要：
var data = [{
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
}];
回答by deco
Had the same issue recently, solved by adding traditional: true,
最近有同样的问题，通过添加解决 traditional: true,
回答by Derly Pacheco
function do_ajax(elem, mydata, filename)
{
$.ajax({
url: filename,
context: elem,
data: mydata,
**contentType: false,
processData: false**
datatype: "html",
success: function (data, textStatus, xhr) {
elem.innerHTML = data;
}
});
}
回答by Nitin Sharma
$.ajax({
url:"",
type: "POST",
data: new FormData($('#uploadDatabaseForm')[0]),
contentType:false,
cache: false,
processData:false,
success:function (msg) {}
});
回答by Ali Asad
Try This:
尝试这个：
$.ajax({
url:"",
type: "POST",
data: new FormData($('#uploadDatabaseForm')[0]),
contentType:false,
cache: false,
processData:false,
success:function (msg) {}
});
