javascript - 我对setTimeout/clearTimeout有问题

我有以下js

document.addEventListener("DOMContentLoaded", function() {
  document.querySelector("#pageRedirect").addEventListener("change", changeHandler);
});

function changeHandler() {
  var timer;
  if (pageRedirect.checked) {
    timer = setTimeout(function() {
      window.location.href = 'http://www.google.com';
    }, 3000);

    console.log(pageRedirect.checked);
  } else {
    //dont redirect
    clearTimeout(timer);

    console.log(pageRedirect.checked);
  }
}

<input type="checkbox" id="pageRedirect" name="pageRedirect" />

取消选中复选框时，我不重定向，但确实如此。我的错在哪里？

谢谢。

最佳答案

问题是计时器ID的变量声明的位置。它在函数内部，因此当您尝试清除它时，没有在setTimeout中分配的ID。您需要将声明移出函数之外，以便可以在调用之间保留计时器的句柄：

var timer;
function changeHandler(){
    // etc

对于clearTimeout，这与the spec的复合表示：


  如果handle未在调用该方法的WindowTimers对象的活动超时列表中标识出条目，则该方法不执行任何操作。


即它会静默忽略任何无效的计时器句柄，在您的情况下为undefined。