关于javascript：这段代码中导致“Uncaught TypeError：Illegal Invocation”的原因是什么？

What is causing “Uncaught TypeError: Illegal Invocation” in this code?

谷歌Chrome的控制台告诉我

Uncaught TypeError: Illegal Invocation

当调用以下函数时

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

$('#txtUploadFile').on('change', function (e) {
var files = e.target.files;
if (files.length > 0) {
if (window.FormData !== undefined) {
var data = new FormData();
for (var x = 0; x < files.length; x++) {
data.append("file" + x, files[x]);
}

$.ajax({
xhr: function() {
var xhr = new window.XMLHttpRequest();
xhr.upload.addEventListener("progress", function(evt) {
if (evt.lengthComputable) {
var percentComplete = evt.loaded / evt.total * 100;
console.log("percentComplete =" + percentComplete);
}
else
{
console.log("lengthComputable evaluated to false;")
}
}, false);

xhr.addEventListener("progress", function(evt) {
if (evt.lengthComputable) {
var percentComplete = evt.loaded / evt.total * 100;
console.log("percentComplete =" + percentComplete);
}
else
{
console.log("lengthComputable evaluated to false;")
}
}, false);

return xhr;
},
type: 'POST',
url: '@Url.Action("upload","FileUploadAsync")',
data: data,
success: function(data){
console.log("success!");
}
});
} else {
alert("This browser doesn't support HTML5 file uploads!");
}
}
});

我已经看过这个问题的stackoverflow帖子，没有一个原因与我在我的文章中看到的任何东西相关。我不确定它是否重要，但是我可以发布HTML和控制器，如果这可能是问题的一部分。

相关讨论

你错过了两个$.ajax呼叫选项，这些

1 2	contentType: false, processData: false,

像这样做

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

$.ajax({
xhr: function () {
var xhr = new window.XMLHttpRequest();
xhr.upload.addEventListener("progress", function (evt) {
if (evt.lengthComputable) {
var percentComplete = evt.loaded / evt.total * 100;
console.log("percentComplete =" + percentComplete);
} else {
console.log("lengthComputable evaluated to false;")
}
}, false);

xhr.addEventListener("progress", function (evt) {
if (evt.lengthComputable) {
var percentComplete = evt.loaded / evt.total * 100;
console.log("percentComplete =" + percentComplete);
} else {
console.log("lengthComputable evaluated to false;")
}
}, false);

return xhr;
},
type: 'POST',
url: '@Url.Action("upload","FileUploadAsync")',
data: data,
contentType: false,
processData: false,
success: function (data) {
console.log("success!");
}
});

如果让jquery在内部处理文件，它将抛出一个Illegal invocation错误。