如何清除函数中设置的javascript超时

我在Javascript中有一个递归类型函数，运行方式如下：

function loadThumb(thumb) {
    rotate=setTimeout(function() {
        loadThumb(next);
    }, delay);
}

注意：我简化了该函数，使其更易于阅读

我有这样的“a”标签

<a href="#" onclick="loadThumb(3); clearTimeout(rotate);">Load thumb 3</a>

但是，它们不会清除计时器，计时器将继续在函数中循环，而不考虑正在调用的

clearTimeout（）

---

你知道为什么吗？我认为这可能与范围问题或类似问题有关。

在链接上返回false

因为您没有使用var rotate，所以它不应该是一个范围问题，因为rotate将在窗口范围内。你能显示完整的代码吗

内联脚本被认为是糟糕的编码——您应该在页面加载时附加事件处理程序

此外，您不应该在可能为一个映像调用的函数中使用setTimeout

试试这个：

var rotate,next=1;
function loadThumb(thumb) {
  if (thumb) ... use thumb
  else ... use next
}

function slide() {
    rotate=setInterval(function() {
        loadThumb();
        next++; 
        if (next>=images.length) next=0;
    }, delay);
}

window.onload=function() {
  var links = document.getElementsByTagName("a");
  if (links[i].className==="thumbLink") {
    links[i].onclick=function() {
      var idx = this.id.replace("link","");
      loadThumb(idx);
      clearInterval(rotate);
      return false;
    }
  }
  document.getElementById("start").onclick=function() {
    slide();
    return false;
  }
  document.getElementById("stop").onclick=function() {
    clearInterval(rotate);
    return false;
  }
  slide();
}

var rotate = 0;
function loadThumb(thumb) {

    rotate=setTimeout(function() {
        loadThumb(next);
    }, delay);

}

假定

<a href="#" id="start">Start</a>
<a href="#" id="stop">Stop</a>

<a href="#" id="link0" class="thumbLink">Show 1</a>
<a href="#" id="link1" class="thumbLink">Show 2</a>
<a href="#" id="link2" class="thumbLink">Show 3</a>

---

这可能是范围的问题，因此将作为全局变量进行旋转并调用

clearTimeout（旋转）

请参阅
如果您没有在外部声明
旋转
，这可能是一个范围问题

试试这个：

var rotate,next=1;
function loadThumb(thumb) {
  if (thumb) ... use thumb
  else ... use next
}

function slide() {
    rotate=setInterval(function() {
        loadThumb();
        next++; 
        if (next>=images.length) next=0;
    }, delay);
}

window.onload=function() {
  var links = document.getElementsByTagName("a");
  if (links[i].className==="thumbLink") {
    links[i].onclick=function() {
      var idx = this.id.replace("link","");
      loadThumb(idx);
      clearInterval(rotate);
      return false;
    }
  }
  document.getElementById("start").onclick=function() {
    slide();
    return false;
  }
  document.getElementById("stop").onclick=function() {
    clearInterval(rotate);
    return false;
  }
  slide();
}

var rotate = 0;
function loadThumb(thumb) {

    rotate=setTimeout(function() {
        loadThumb(next);
    }, delay);

}

我不确定您到底在做什么，因为据我所知，您没有发布所有代码，但这对我来说更合适：

function loadThumb(thumb) {

    return setTimeout(function() {
        loadThumb(next);
    }, delay);

}

然后：

<a href="#" onclick="clearTimeout(loadThumb(3));">Load thumb 3</a>

是的，您需要将rotate设置为全局变量。只需在函数外部声明它，如下所示：

var rotate;
var delay = 1000;

function loadThumb(thumb) {
    alert("loading thumb: " + thumb);
    rotate = setTimeout(function() {
        loadThumb(thumb + 1);
    }, delay);
}

此外，在调用
loadThumb
之前，您需要确保清除超时。否则，您将清除刚刚启动的计时器

<a href="#" onclick="clearTimeout(rotate); loadThumb(3);">Load thumb 3</a>



fiddle:
如果必须管理多个超时，可以使用全局范围中的对象和一些自定义方法来创建和删除超时。要访问这些方法，您可以将调用放在链接的onclick处理程序中（如示例中所示），或者使用jQuery之类的库来绑定它们

<script type="text/javascript">
    var timeouts = timeouts || {};

    function createTimeout(name, milliseconds, callback) {
        timeouts.name = setTimeout(callback, milliseconds);
    }

    function removeTimeout(name) {
        if (typeof(timeouts.name) !== undefined) {
            clearTimeout(timeouts.name);
            timeouts.name = undefined;
        }
    }

    createTimeout('foo', 5000, function() {
        alert('timeout')
    });
</script>


var超时=超时| |{}；
函数createTimeout（名称、毫秒、回调）{
timeouts.name=setTimeout（回调，毫秒）；
}
函数removeTimeout（名称）{
if（typeof（timeouts.name）！==未定义）{
clearTimeout（timeouts.name）；
timeouts.name=未定义；
}
}
createTimeout（'foo'，5000，函数（）{
警报（'超时'）
});

我也在JSFIDLE上发布了一个例子：为什么使用javascript：-这是默认值-为什么函数中没有返回false？虽然
javascript:
没有错，但也没有用。您也可以编写
foo:
或
bar:
或
sfgasdga:
。请删除它，因为它可能会使人们认为它是必需的@我不会说这是默认的。在链接（URL）中，它被用作一种协议，以便浏览器知道该做什么，但*

上的

属性总是被解释为JavaScript（在这种情况下，可能这就是你的意思，nvm；）。据我所知，它不是一个标签，而是（用来）告诉浏览器即将出现的代码是JavaScript。它仅在浏览器为IE且页面上的第一个脚本为VBScript时有用，因为（至少以前是这样）会将内联事件处理程序中的默认语言设置为VBScript。感谢您的注释。这是我的错。通常我在href属性中添加内容时放置javascript:并返回false。没有var rotate应该使它成为一个windows范围的VARO是的，我就是这么做的，在它被弄糊涂后调用它，它现在工作了。谢谢