jQuery ajax Uncaught TypeError: Illegal invocation

Question

我读过的关于这个问题的所有帖子都是因为传递的对象包含其他对象，而不是原始值。

我的数据对象都是原始值，但它仍然不起作用。

代码如下：

function ImageUploader(imgEl, params) {
    this.imgEl = imgEl;
    this.params = params;
    this.params["Function"] = "saveImage";
}

// send data from asynchronously uploaded image (as image URI)
// to PHP script which will write data to file
ImageUploader.prototype.uploadImage = function () {
    var iu = this;
    var fileReader = new FileReader();

    fileReader.onload = function (e) {
        iu.params["Image"] = e.target.result;
        console.log(iu.params);
        $.ajax({
            type: "POST",
            url: "/scripts/php/Form.php",
            data: iu.params,
            success: alert,
            error: function (jqXHR, status, error) {
                console.log(error, this);
            }
        });
    };

    this.params["FileName"] = this.imgEl.files[0].fileName || this.imgEl.files[0].name;
    fileReader.readAsDataURL(this.imgEl.files[0]);
};

这是它拒绝的示例对象：

{
  FileName: "Matrix.jpg",
  Function: "saveImage",
  ID: 10,
  Image: "data:image/jpeg;base64,...",
  Line: 1,
  Name: "Test Form"
}

Answer 1

此错误与您的 iu.params 对象无关。错误与此行有关：

success: alert,

需要在 window 对象的 "context" 中调用 window.alert()（或只是 alert()）函数。

当您执行 success: alert 时，jQuery 调用运行 AJAX 请求的 jqXHR 对象的成功回调。像这样：

success.call(jqXHR, data)

_{我不知道确切的代码jQuery使用}

因此，您的 alert 被错误地调用 "context"，因此会引发错误。要修复它，只需将匿名函数传递给 success:

success: function(data){
    alert(data);
}

或者，如果您真的想要，您可以使用.bind()来确保在正确的上下文中调用alert()：

success: alert.bind(window)

如果你真的真的想要保留success: alert，那么你可以告诉jQuery调用它在正确的上下文中，通过将 context: window 添加到您的 $.ajax 调用中。

请注意，alert.bind()（进而 context: window）可能无法在所有浏览器中工作，因此 不建议 。我建议您改为使用所示的匿名函数。

jQuery ajax Uncaught TypeError: Illegal invocation

jQuery ajax Uncaught TypeError: Illegal invocation

javascript

php

ajax

jquery