Question

我正在尝试构建一个计时器。请比较两种情况（第一种情况有效，而不是第二种情况）：

内联javascript http://jsfiddle.net/x7xhA/
非内联javascript http://jsfiddle.net/x7xhA/1/

有什么问题？

Answer 1

这是jsFiddle的“JavaScript部分”用户常遇到的问题。你看，放入'JavaScript部分'的代码包含在一个用作load处理程序的函数中，所以在你的第二个例子中，实际的输出结果如下：

  <script type='text/javascript'>
  //<![CDATA[ 
  $(window).load(function(){
  var seconds = 0;

function timedCount() {
    $("#txt").val(seconds);
    seconds += 1;
    setTimeout("timedCount()",1000);
}
  });
  //]]> 
  </script>

现在，timedCount不再是一个全局函数，因为它仅在load处理程序的范围内可用，并且当您将setTimeout与一串代码一起使用时，从全球范围进行评估。

解决此问题的方法包括：

将setTimeout来电更改为setTimeout(timedCount, 1000);

这样做，是将实际的函数对象传递给setTimeout。而不是每次从全局范围评估代码字符串，这基本上保留了调用函数的能力，因为范围不再重要 - 您将函数交给setTimeout。

  var seconds = 0;

function timedCount() {
    $("#txt").val(seconds);
    seconds += 1;
    setTimeout(timedCount,1000);
}

使用timedCount

使timedCount = function() { ... };成为一个全局函数

这只会使timedCount成为全局变量，因此当setTimeout尝试从全局范围中评估timedCount();时，它会成功，因为全局范围内存在timedCount函数范围。

  var seconds = 0;

timedCount = function() {
    $("#txt").val(seconds);
    seconds += 1;
    setTimeout("timedCount();",1000);
}

Answer 2

第二个函数将timedCount函数包装在jQuery ready函数中，因此在全局范围内不可用。

修正：http://jsfiddle.net/x7xhA/2/

内联JavaScript和非内联JavaScript之间的不同行为

2 个答案: