包含的文件中引发引用错误..除非调用文件包含慢速代码

Reference Errors thrown in included file... unless calling file includes slow code

本文关键字：文件包 调用 代码 错误 文件 引用 包含      更新时间：2023-09-26

本周我在清理一些旧的JavaScript代码时，发生了一件有趣的事情。当我取出一些慢代码时，页面开始对通过Ajax调用包含的文件中的代码抛出引用错误。

下面是这个问题的（大大简化的）例子。当直接请求时，第一个文件将正常工作。但是，当通过Ajax调用时，文档就绪事件已经发生，因此内的代码会立即执行。Chrome抛出一个错误，例如："VM1414:2未捕获引用错误：they_log未定义"

<html>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.js"></script>
<script>
    $(document).ready(function() { 
        they_log("Be alerted");
    });
</script>
<!-- Two separate script tags prevent hoisting -->
<script>
function they_log($string) {
    console.log($string);
}
</script>
</body>
</html>

但是，如果下面的注释"alert"行被取消注释，则引用错误不会在Chrome或Firefox中抛出（尽管它们仍然会在Safari中出现——除非您让模式对话框打开几秒钟）。

<!doctype html>
<html lang="en">
<head>
  <title>Prototype of reference error issue</title>
</head>
<body>
    <div id="place" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.js"></script>
    <script>
        $.get( "http://localhost/path/to/first/file.html", function( data ) {
          $("#place").html(data);
        });
        //alert("I get rid of the reference error");
    </script>
</body>
</html>

我的问题是，警报消息（或包含文件中的类似慢代码）如何防止引用错误的发生？

我特别感兴趣的是，无论发生了什么，让代码在没有错误的情况下执行，都可以指望它能始终如一地工作（至少在Chrome和Firefox中），或者是否存在类似竞赛的情况，它可能会间歇性地失败。

我观察到您的alert在文档就绪之前运行，并且它阻止文档就绪直到警报对话框关闭。Fiddle：https://jsfiddle.net/24pg3yzk/

显示警报对话框时，Ajax请求及其完成处理程序$("#place").html(data);可能已完成。是的，这是比赛条件。

这是标准行为还是一贯行为？我不知道。我认为这是有道理的，因为警告"对话框是模式窗口——它们阻止用户访问程序界面的其余部分，直到对话框关闭"（来源），但没有从jQuery文档中确认它。

相关文章：