使用jQuery延迟JavaScript函数调用

Question

JavaScript:

$(document).ready(function(){
    
    function sample() {
       alert("This is sample function");
    }
 
    $("#button").click(function(){
        t = setTimeout("sample()",2000);
    });
        
});

HTML:

<input type="button" id="button" value="Call sample function with delay">

当我点击按钮时，sample() 函数没有延迟2秒钟调用。 我不知道出了什么问题。

如何通过jQuery使用 setTimeout() 调用JavaScript函数？

- Mohan Ram

---

你应该在控制台上看到类似“sample未定义”的信息。 - Felix Kling

@Felix Kling，如果你是在提到我，我可以看到一个定义的示例。 - Starx

Answer 1

由于您在传递给ready的匿名函数内声明了sample，因此它的作用域限定在该函数内。

然后，您将一个字符串传递给setTimeout，该字符串在2秒后被eval执行。这发生在当前作用域之外，因此无法找到该函数。

仅传递函数给setTimeout，使用eval会效率低下且难以调试。

setTimeout(sample,2000)

- Quentin

---

请自行调整或包装以下代码：setTimeout( function() { myBarFunction('whatever','parameter', 123)}, 2000 ); - Frank N

Answer 2

function sample() {
    alert("This is sample function");
}

$(function() {
    $("#button").click(function() {
        setTimeout(sample, 2000);
    });

});

jsFiddle。

如果你想在那里封装sample()，请将整个内容包装在一个立即执行函数(function() { ... })()中。

- alex

Answer 3

非常简单，只需使用setTimeout()在特定的毫秒数内调用函数即可。

setTimeout(myFunction, 2000)

function myFunction() {
    alert('Was called after 2 seconds');
}

或者您甚至可以在超时内部启动函数，像这样：

setTimeout(function() {
    alert('Was called after 2 seconds');
}, 2000)

- Fizzix