像许多其他人一样,我的网站使用 jQuery。当我打开开发人员工具时,我看到一条警告说 XMLHTTPRequest 是
已弃用,因为它会对最终用户的体验产生不利影响。
我继续阅读了部分文档,但它是相当技术性的。有人可以用简单的术语解释从 XMLHTTPRequest 转移到 WHATWG 的后果吗?它说它发生在2012年。
此外,文档说工作人员之外的同步 XMLHttpRequest 正在从网络平台中删除,当发生这种情况时,如果用户代理在服务中使用它们,他们是否需要修改现有代码?
像许多其他人一样,我的网站使用 jQuery。当我打开开发人员工具时,我看到一条警告说 XMLHTTPRequest 是
已弃用,因为它会对最终用户的体验产生不利影响。
我继续阅读了部分文档,但它是相当技术性的。有人可以用简单的术语解释从 XMLHTTPRequest 转移到 WHATWG 的后果吗?它说它发生在2012年。
此外,文档说工作人员之外的同步 XMLHttpRequest 正在从网络平台中删除,当发生这种情况时,如果用户代理在服务中使用它们,他们是否需要修改现有代码?
为避免此警告,请勿使用:
async: false
在您的任何$.ajax()
电话中。这是唯一XMLHttpRequest
不推荐使用的功能。
默认为async: true
,因此如果您根本不使用此选项,那么如果该功能被真正删除,您的代码应该是安全的。
然而,它可能不会——它可能会从标准中删除,但我敢打赌浏览器将继续支持它很多年。因此,如果您出于某种原因确实需要同步 AJAX,则可以使用async: false
并忽略警告。但是同步 AJAX 被认为是糟糕的风格是有充分理由的,因此您可能应该尝试找到一种方法来避免它。编写 Flash 应用程序的人可能也从未想过它会消失,但它现在正处于逐步淘汰的过程中。
请注意,Fetch
要替换的APIXMLHttpRequest
甚至不提供同步选项。
这发生在我身上,因为在正文部分结束之前有一个指向头部外部的外部 js 的链接。你知道,其中之一:
<script src="http://somesite.net/js/somefile.js">
它与 JQuery 没有任何关系。
你可能会看到同样的事情做这样的事情:
var script = $("<script></script>");
script.attr("src", basepath + "someotherfile.js");
$(document.body).append(script);
但我还没有测试过这个想法。
@henri-chan在评论中提到它,但我认为它值得更多关注:
当您使用 jQuery/javascript 用新的 html 更新元素的内容,并且这个新的 html 包含<script>
标签时,这些标签会同步执行,从而触发此错误。样式表也是如此。
当您看到XHR
在控制台窗口中加载(多个)脚本或样式表时,您就知道正在发生这种情况。(火狐)。
以前的答案(都是正确的)没有一个适合我的情况:我不使用async
参数 injQuery.ajax()
并且我不包含脚本标记作为返回内容的一部分,例如:
<div>
SOME CONTENT HERE
</div>
<script src="/scripts/script.js"></script>
我的情况是我连续调用两个 AJAX 请求,目的是同时更新两个 div:
function f1() {
$.ajax(...); // XMLHTTP request to url_1 and append result to div_1
}
function f2() {
$.ajax(...); // XMLHTTP request to url_2 and append result to div_2
}
function anchor_f1(){
$('a.anchor1').click(function(){
f1();
})
}
function anchor_f2(){
$('a.anchor2').click(function(){
f2();
});
}
// the listener of anchor 3 the source of problem
function anchor_problem(){
$('a.anchor3').click(function(){
f1();
f2();
});
}
anchor_f1();
anchor_f2();
anchor_problem();
当我点击时a.anchor3
,它会引发警告标志。我通过替换 f2 调用click()
功能解决了这个问题:
function anchor_problem(){
$('a.anchor_problem').click(function(){
f1();
$('a.anchor_f2').click();
});
}