Question

我只在用户导航到页面上的那个标签页时，只为我的网页的一部分加载了一个JS文件。

var scriptFile = document.createElement("script");
scriptFile.setAttribute("type", "text/javascript");
scriptFile.setAttribute("src", scriptURL);

我正在尝试为此动态加载提供错误处理机制，以便在JS加载超时或者在URL指定的位置中JS不可用时，我可以显示错误消息。

这就是我试图实现错误处理（对于IE）：

scriptFile.onreadystatechange = function() { // For IE
    if (this.readyState == 'complete' || this.readyState == 'loaded') {
        // Display content in tab
    } else {
        // Display error message
    }
}

这导致了一个问题。如果一切正常，并且JS按预期存在，我首先收到错误消息，然后是正确的内容。

经过一些头脑风暴，我发现readyState首先从“未初始化”变为“加载”，然后变为“加载”。当状态处于“加载”状态时，显示错误消息。之后，状态正在变为“已加载”，此时正在显示内容。

如何解决这个问题，以便最初不显示错误？

Answer 1

因为没有“哎呀我死了！”状态，您无法显示错误消息。

编辑：删除代码，因为我的观点是你不能这样做。使用AJAX请求，您可以检查响应并查看它是否为404，但您无法使用脚本标记执行此操作。

edit2：第二个想法，为什么不通过AJAX获取脚本并注入'＆lt; script type =“text / javascript”＆gt;' + responseText +'＆lt; / script＆gt;'在document.body中？

要检查AJAX请求是否已被轰炸，请检查XMLHTTPRequest对象的status属性。如果它是404，那么它就是404.

另外，你不应该手工做这些事情。我总是建议使用Prototype或jQuery。由于我被Prototype宠坏了，我不应该试着解释如何检查请求的状态。你为什么不在这里问另一个问题如何处理AJAX请求？专业人士肯定会告诉你如何处理各种各样的失败，而不仅仅是404。

Answer 2

如何使用一个（全局）变量来检查它是否已加载（例如，脚本将在加载完成后设置它）然后使用timer设置另一个函数（已在加载函数之前的页面上）以检查该变量（例如5秒延迟？）

如果未设置变量（在预定义的时间之后），则向用户显示错误。

Answer 3

我认为你需要废弃“else”，因为它总会经历“加载”状态，无论它是否正常工作，所以“else”分支没有做任何有用的事情。

相反，设置超时。

var scriptTimer = setTimeout(function() {
  // show error message
  // (should ideally precede with a check the content hasn't
  // been displayed, in case of race condition)
});
scriptFile.onreadystatechange = function() { // For IE
    if (this.readyState == 'complete' || this.readyState == 'loaded') {
       clearTimeout(scriptTimer);
       // now display content in tab
    }
}

Answer 4

编辑：我的方法错了 - 使用AJAX作为Kaze建议

动态JS加载中的错误处理

4 个答案: