javascript函數延遲不止一次

Question

我在這里編寫了一個將在4秒后執行的函數，但是它只會等待4秒一次，因為當我第二次再次觸發它時，延遲似乎不再起作用。 這是我的示例代碼：

setTimeout(function sampleFunction() {
    alert("sample alert");
}, 4000);

按下按鈕即可觸發我的功能。 我希望每次按下按鈕都會有延遲。 我想多次使用此延遲功能，但延遲只能使用一次。 我如何使其不止一次地工作？ 提前致謝。

這是觸發它的按鈕：

<a data-role="button" onClick="sampleFunction( )">Trigger Button</a>

Answer 1

使用setInterval而不是setTimeout 。 這將使其每4秒運行一次。 如果需要停止它，可以使用clearInterval停止它。 但是，為此，您需要將setInterval的返回值保存在某個地方。

編輯：要基於按鈕單擊觸發它，需要確保您具有onclick處理程序（如果使用jQuery $('#whatever_id').on('click', ...) ）。 您可以使用以下代碼：

btn = document.getElementById('mybutton');

btn.onclick = function() {
    setTimeout(function sampleFunction() {
        alert("sample alert");
    }, 200);
};

工作jsFiddle

Answer 2

更新：

使用您提供的新信息，聽起來您只需要為按鈕設置事件處理程序即可：

document.getElementById('buttonId').addEventListener('click', function () {
    setTimeout(function() {
        alert('test');
    }, 4000);
}, false);

原版的：

使用setInterval或使用setTimeout（首選）。

var timer = setTimeout(function timerFn() {
    alert('test');
    timer = setTimeout(timerFn, 1000);
}, 1000);

使用setTimeout進行操作可確保該函數在超時長度內僅被調用一次。

如果使用setInterval，則可能會建立回調，並且一個接一個地執行所有回調。 setTimeout並非如此。

Answer 3

您正在調用該函數，因此它正在執行。 如果需要setTimeout，則需要調用包含它的函數。 嘗試這個：

function sampleFunction() {
    setTimeout(function {
        alert("sample alert");
    }, 4000);
}