JQuery: Ajax 请求下的‘ Uncatch TypeError: 非法调用’-几个元素

我有两个选择元素,A 和 B: 当 A 的选择选项改变时,B 的选项必须相应地更新。A 中的每个元素都意味着 B 中的许多元素,这是一对多的关系(A 包含国家,B 应该包含位于给定国家的城市)。

函数 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;
}
});
}

为了更新 B 的选项,我在 A 的 onChange事件中添加了一个函数调用。下面是在触发 onChange 事件(A的)时运行的函数:

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');
}

}

我在 JQuery 文档中读到 data可以是一个数组(键值对):

var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};

相反,如果我的数据是一个字符串,我不会得到这个错误:

var data = 'mode=filter_city&id_A=' + e[e.selectedIndex];

但是在我的服务器端 php 代码中,我需要变量的“数组版本”。

Uncaught TypeError: Illegal invocation位于“ jquery-1.7.2。“ min.js”文件,这个文件都是压缩的,所以我无法找出是哪部分代码引发了错误。

有没有什么设置我可以改变我的代码,让它接受数据作为关联数组?

272742 次浏览

我在 JQuery 文档中读到,数据可以是一个数组(键值对)。 如果我输入:

这是对象,不是数组:

var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};

你可能需要:

var data = [{
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
}];

来自 processData的 jQuery 文档:

ProcessData Boolean
默认为真
默认情况下,作为对象传递给 data 选项的数据(从技术上讲,不是字符串)将被处理并转换为查询字符串,符合默认的内容类型“ application/x-www-form-urlencode”。如果要发送 DOMDocument 或其他未处理的数据,请将此选项设置为 false。

资料来源: http://api.jquery.com/jquery.ajax

看起来您必须使用 processData将数据发送到服务器,或者修改 php 脚本以支持 querystring 编码的参数。

多亏了与 沙弗拉兹的谈话,我们才能找到解决办法。

问题是我传递的是一个 HTML 元素而不是它的值,而这正是我想要做的(事实上在我的 php 代码中,我需要这个值作为查询 cities表和过滤正确条目的外键)。

所以,不是:

var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex]
};

应该是:

var data = {
'mode': 'filter_city',
'id_A': e[e.selectedIndex].value
};

注意: 检查 Jason Kulatunga 的 回答,它引用 JQuery doc 来解释为什么传递 HTML 元素会引起麻烦。

试试这个:

            $.ajax({
url:"",
type: "POST",
data: new FormData($('#uploadDatabaseForm')[0]),
contentType:false,
cache: false,
processData:false,
success:function (msg) {}
});

最近遇到了同样的问题,通过增加 traditional: true,解决了

我在发布 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);
}
});
$.ajax({
url:"",
type: "POST",
data: new FormData($('#uploadDatabaseForm')[0]),
contentType:false,
cache: false,
processData:false,
success:function (msg) {}
});
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;
}
});
}

请按照程序来解决这个问题:

$.ajax({
url: 'https://your-api-endpoint',
type: 'post',
data: new formData(this),
processData: false,
contentType: false,
success: function(response) {
console.log(response)
}
})

您必须使用 processData: false 和 contentType: false 这两行。您的问题将得到解决。

我在 $.getJSON上的 illegal invocation错误是由于传递 undefined作为 data对象的值之一造成的。解决了这个错误。

我得到了同样的问题,我可以纠正它如下。

var formData = new FormData(document.getElementById('form_id'));
                                

$.ajax({
type: 'POST',
url: '/Settings/de_acc',
data: formData,
cache: false,
contentType: false,
processData: false,
success: function(res){
console.log(res);
}
})