Question

我不是100％确定setTimeout如何在JavaScript中运行。说我有这样的事情：

$(document).ready(function() {           
    testTimeout();        
});

function testTimeout() {
    alert("testing timeout");
    setTimeout(testTimeout, 5000);
}

这将在页面准备好后每5显示一个弹出窗口。如果我从按钮点击调用testTimeout会发生什么？

$("#button").click(function() {        
    testTimeout();
});

按钮是否会单击调用testTimeout并每5秒添加一次超时？或者，按钮单击是否会重置按钮按下时的超时？我问的原因是因为我想设计这样的东西，我可以将参数传递给我的超时功能。当网页启动时，我有一个默认参数。但是，如果我按下一个按钮，我希望立即调用我的超时功能，并在我的新参数后每隔5秒调用一次。但是，我不希望带旧参数的超时功能继续重复。我怎样才能做到这一点？任何帮助和理解将不胜感激。

Answer 1

这将在页面准备好后每隔5显示一个弹出窗口。

不，它不会，它会反复显示警报而没有延迟和/或导致过多的递归＆＃34;错误，因为setTimeout(testTimeout(), 5000) 调用 testTimeout并将其返回值传递到setTimeout，就像foo(bar()) 调用 {{ 1}}并将其返回值传递给bar。

如果您删除foo：

()

然后就可以了。

如果我从按钮点击调用testTimeout会怎么样？

你最终会被调用两次的函数（每5秒钟调用一次以上），因为每次调用它时，它都会自行重新安排。第三次会更频繁地（三次/秒），等等。

如果你想避免这种情况，一个选项就是记住定时器句柄，如果在此之前调用该函数，则取消任何未完成的定时回调：

function testTimeout() {
    alert("testing timeout");
    setTimeout(testTimeout, 5000);
    // here --------------^
}

（我使用var handle = 0; function testTimeout() { clearTimeout(handle); // Clears the timed call if we're being called beforehand alert("testing timeout"); handle = setTimeout(testTimeout, 5000); }初始化了handle，因为使用0调用clearTimeout是无操作。）

Answer 2

您是否尝试将变量分配给您的setinterval;

var foo = setTimeout(testTimeout(), 5000);

然后当正确的事件发生时就破坏那个变量。

clearInterval(foo);

现在你可以再分配一次......

Answer 3

在你的情况下，它会无休止地重复，因为你正在执行函数而不是传递引用。你应该这样做：

function testTimeout() {
    alert("testing timeout)";
    setTimeout(testTimeout, 5000);
}

请注意testTimeout后缺少的大括号。这告诉setTimeout执行该函数，而不是该函数的结果，这是原始代码的行为方式。

＆＃34;我希望立即调用我的超时功能，并在我的新参数后每5秒调用一次。但是，我不希望使用旧参数的超时功能继续重复＆＃34;

为了实现您尝试做的事情，您应该删除超时：

var timeoutId;
function testTimeout() {
    alert("testing timeout)";
    clearTimeout(timeoutId );
    timeoutId = setTimeout(testTimeout, 5000);
}

注意：

您可以通过捕获从setTimeout方法返回的id并将其传递给clearTimeout方法来停止先前的timeoutI触发

调用已分配给它的SetTimeout的JavaScript函数

3 个答案: