javascript - $(document).ready(function() { ... }) 中的 setInterval 奇怪(有问题？)行为；堵塞

Question

让我从这里开始。在 w3cshools.com - http://www.w3schools.com/jsref/met_win_setinterval.asp - 他们有一个片段演示如何使用 javascript setInterval 函数(令人惊讶的是它有一个不匹配的 但那不是重点)。

我需要使用 setInterval()，有时我喜欢引用一些“标准”主体来了解推荐的用法。在我的开发环境中，当我在 jquery $(document).ready(function() { ... }); block 中使用 setInterval() 时，似乎有些东西正在破坏 setInterval() 的行为/工作。

图 1 - 作品:典型/传统 <script> block

<script type="text/javascript">
    var refreshIntervalId;

    function testMessage() {
        window.alert("Hello");
    }
    refreshIntervalId = setInterval("testMessage()", 5000);
</script>

图 2 - 不起作用: jQuery block

<script type="text/javascript">
    $(document).ready(function() {
        var refreshIntervalId;

        function testMessage() {
            window.alert("Hello");
        }
        refreshIntervalId = setInterval("testMessage()", 5000);
    });
</script>

图 3 - 作品:jQuery block - 使用 setInterval(testMessage, 5000) 而不是 setInterval("testMessage()", 5000)

<script type="text/javascript">
    $(document).ready(function() {
        var refreshIntervalId;

        function testMessage() {
            window.alert("Hello");
        }
        refreshIntervalId = setInterval(testMessage, 5000);
    });
</script>

事实证明，如果我尝试使用 $(document).ready(function() {}); block 将函数作为字符串传递，则会收到一条错误，表明函数未定义。为了避免 IE、Chrome 和 Firefox 都报告错误:

IE:Microsoft JScript 运行时错误:属性“testMessage”的值为 null 或未定义，而不是 Function 对象

Chrome:未捕获的ReferenceError:未定义testMessage(匿名函数)

Firefox:testMessage 未定义。

我想知道(如果可能的话)是，这是否是不符合标准的结果，或者当我尝试使用setInterval("testMessage()", 5000)<时出现了什么问题 来自 jQuery block 内？可能会发生一些损坏或者这是正确的行为吗？

Answer 1

setTimeout 和 setInterval 破坏了作用域，因此在查找时找不到 testMessage (因为该函数的作用域位于内部)您传递给 ready 的匿名函数)。浏览器运行正常。

这是您永远不应该使用字符串格式的原因之一……或者尝试向可怕的 W3Schools 学习。