调用setTimeout内部的函数时发生引用错误

Reference Error when calling function inside setTimeout

本文关键字:引用 错误 函数 setTimeout 内部 调用      更新时间:2023-09-26

我在setTimeout函数中不断收到引用错误
以下是javascript文件中的代码

( function( $, undefined ) {
  $( document ).ready( init );
  function init() {
    registerEventListeners();
  }
  function registerEventListeners() {
    $( '.start_countdown').click( handleStart );
    $( '.end_countdown').click( handleEnd );
  }
  var countdown;
  var countdown_number;
  function handleStart() {
    countdown_number = 11;
    countdown_trigger(countdown_number);
  }
  function countdown_trigger() {
    if (countdown_number > 0) {
      countdown_number --;
      document.getElementById('countdown_text').innerHTML = countdown_number;
      if (countdown_number > 0) {
          countdown = setTimeout('countdown_trigger()', 1000);
      }
    }
  }
  function handleEnd() {
    clearTimeout(countdown);
  }
})( jQuery );  

在jade.js文件中:

extends layout
append scripts
  script(src='/javascripts/countDownRedirect.js')
block content
  h1= title
  p Redirecting you to your documents shortly
  div
    button.start_countdown#start Start Countdown
    button.end_countdown#end End Countdown
  div#countdown_text Placeholding text

引用错误:"countdown_trigger()"未定义

加载页面后,一切似乎都很正常
单击开始按钮显示10,但随后抛出参考错误。有什么建议吗
感谢

当您在setTimeout中使用引号时,您调用的是eval,这不是一个好主意。尝试传递对函数的引用,而不是字符串:

countdown = setTimeout(countdown_trigger, 1000);

为了解释发生了什么以及为什么它不起作用,当您将字符串传递给setTimeout()时,eval()会在全局范围内对该字符串求值。这意味着在全局范围内没有可用的局部函数或变量。由于countdown_trigger()函数是在另一个函数内声明的,因此它不在全局范围内,因此eval()不可用,因此当您将其传递给setTimeout()时,它不起作用。

这是从不将字符串传递给setTimeout()的众多原因之一。

相反,传递一个真实的函数引用,该引用在您当前的范围内进行评估,如下所示:

setTimeout(countdown_trigger, 1000);