jQuery - Illegal invocation

jQuery v1.7.2

I have this funcion that is giving me the following error while executing :

Uncaught TypeError: Illegal invocation

Here's the function :

$('form[name="twp-tool-distance-form"]').on('submit', function(e) {
e.preventDefault();


var from = $('form[name="twp-tool-distance-form"] input[name="from"]');
var to = $('form[name="twp-tool-distance-form"] input[name="to"]');
var unit = $('form[name="twp-tool-distance-form"] input[name="unit"]');
var speed = game.unit.speed($(unit).val());


if (!/^\d{3}\|\d{3}$/.test($(from).val()))
{
$(from).css('border-color', 'red');
return false;
}


if (!/^\d{3}\|\d{3}$/.test($(to).val()))
{
$(to).css('border-color', 'red');
return false;
}


var data = {
from : from,
to : to,
speed : speed
};


$.ajax({
url : base_url+'index.php',
type: 'POST',
dataType: 'json',
data: data,
cache : false
}).done(function(response) {
alert(response);
});


return false;
});

If I remove data from ajax call, it works .. any suggestions?

Thanks!

417349 次浏览

我认为需要字符串作为数据值。可能是 jQuery 内部没有正确编码/序列化 To & From 对象。

试试:

var data = {
from : from.val(),
to : to.val(),
speed : speed
};

还要注意下面几行:

$(from).css(...
$(to).css(

您不需要 jQuery 包装器,因为 To 和 From 已经是 jQuery 对象。

尝试像这样在 ajax 设置中设置 ProcessData: false

$.ajax({
url : base_url+'index.php',
type: 'POST',
dataType: 'json',
data: data,
cache : false,
processData: false
}).done(function(response) {
alert(response);
});

只是为了记录,如果您尝试在数据中使用未声明的变量,比如

var layout = {};
$.ajax({
...
data: {
layout: laoyut // notice misspelled variable name
},
...
});

我的问题与 processData无关。这是因为我发送了一个函数,这个函数不能在以后用 apply调用,因为它没有足够的参数。具体来说,我不应该使用 alert作为 error回调函数。

$.ajax({
url: csvApi,
success: parseCsvs,
dataType: "json",
timeout: 5000,
processData: false,
error: alert
});

有关为什么这会成为一个问题的更多信息,请参见下面的答案: 为什么某些函数调用在 JavaScript 中被称为“非法调用”?

我能够发现这一点的方法是向 jQuery 添加一个 console.log(list[ firingIndex ]),这样我就可以跟踪它正在触发的内容。

这就是解决办法:

function myError(jqx, textStatus, errStr) {
alert(errStr);
}


$.ajax({
url: csvApi,
success: parseCsvs,
dataType: "json",
timeout: 5000,
error: myError // Note that passing `alert` instead can cause a "jquery.js:3189 Uncaught TypeError: Illegal invocation" sometimes
});

如果你想提交一个使用 Javascript 表格数据 API 和上传文件的表单,你需要设置以下两个选项:

processData: false,
contentType: false

你可以试试以下方法:

//Ajax Form Submission
$(document).on("click", ".afs", function (e) {
e.preventDefault();
e.stopPropagation();
var thisBtn = $(this);
var thisForm = thisBtn.closest("form");
var formData = new FormData(thisForm[0]);
//var formData = thisForm.serializeArray();


$.ajax({
type: "POST",
url: "<?=base_url();?>assignment/createAssignment",
data: formData,
processData: false,
contentType: false,
success:function(data){
if(data=='yes')
{
alert('Success! Record inserted successfully');
}
else if(data=='no')
{
alert('Error! Record not inserted successfully')
}
else
{
alert('Error! Try again');
}
}
});
});

对我来说,我只是变了

注意: 这是在 Django 的情况下,所以我添加了 csrftoken。在您的情况下,您可能不需要它。

增加了 contentType: falseprocessData: false

注释了 "Content-Type": "application/json"

$.ajax({
url: location.pathname,
type: "POST",
crossDomain: true,
dataType: "json",
headers: {
"X-CSRFToken": csrftoken,
"Content-Type": "application/json"
},
data:formData,
success: (response, textStatus, jQxhr) => {


},
error: (jQxhr, textStatus, errorThrown) => {


}
})

$.ajax({
url: location.pathname,
type: "POST",
crossDomain: true,
dataType: "json",
contentType: false,
processData: false,
headers: {
"X-CSRFToken": csrftoken
// "Content-Type": "application/json",
},
data:formData,
success: (response, textStatus, jQxhr) => {


},
error: (jQxhr, textStatus, errorThrown) => {


}
})

成功了。

在我的例子中,我没有定义所有用 ajax 传递给数据的变量。

var page = 1;


$.ajax({
url: 'your_url',
type: "post",
data: { 'page' : page, 'search_candidate' : search_candidate }
success: function(result){
alert('function called');
}
)}

我刚刚定义了变量 var search_candidate = "candidate name";及其工作原理。

var page = 1;
var search_candidate = "candidate name"; // defined
$.ajax({
url: 'your_url',
type: "post",
data: { 'page' : page, 'search_candidate' : search_candidate }
success: function(result){
alert('function called');
}
)}

这也是一个原因: 如果您构建了一个 jQuery 集合(通过。Map ()或类似的东西) ,那么您不应该在。Ajax ()的数据。因为它仍然是一个 JQuery 对象,而不是简单的 JavaScript 数组。你应该用。在 and 获取纯 js 数组时使用 get () ,并且应该在。Ajax ().

为我工作。 ProcessData: false, ContentType: false, 是工作所必需的

 var formData = new FormData($('#author_post')[0]);
formData.append('t','author-add');
$.ajax({
type: 'POST',
url: 'url-here',
cache: false,
processData: false,
contentType: false,
data:formData,
success: function(response) {
//success code
}
});

工作示例代码在这里-

var formData = new FormData($("#formId")[0]);
 

$.ajax({
url : "/api/v1/save-data",
type : "POST",
enctype: "multipart/form-data",
dataType: "json",
data: formData,
success : function(data) {
console.log(data);
},
cache: false,
contentType: false,
processData: false,
error: function() {
console.log("Error");
}
});