javascript - JQuery .click() 处理程序不能接受函数周围的 setTimeout()

Question

我想在函数执行之前在 .click(function() {...}) 处理程序中编程延迟。这不起作用：

$('.okButton').click(setTimeout(function() { ...}, 3000))

它给出了这个错误（在 Chrome 中）：

Uncaught TypeError: Object 2 has no method 'apply'

JQuery 文档没有提供任何关于为什么这不起作用的线索。

如何在执行函数处理程序之前延迟？

score 7 · Accepted Answer

它不起作用，因为setTimeout()不返回函数；它返回一个计时器句柄（一个数字）。

这应该有效：

$('.okButton').click(function() { setTimeout(function() { ...}, 3000); });

JavaScript 函数调用中的参数表达式总是在函数被调用之前被完全计算。您的代码称为setTimeout()，并且其中的返回值被传递到 jQuery 例程中。

score 2 · Accepted Answer

解决方案是有一个 .click() 处理函数，它只调用 setTimeout() 并带有真正处理函数的句柄：

  $('.okButton').click(function() {
        setTimeout(okButtonClickHandler, 3000)
  });

当我尝试这个之前它立即调用处理函数，因为我在 setTimeout() 的参数上包含括号。

不要这样做：

  $('.okButton').click(function() {
        setTimeout(okButtonClickHandler(), 3000)
  });

它将立即执行处理函数。

score 1 · Accepted Answer

为什么不将超时放在回调中？

$('.okButton').click(function() {

  setTimeout(function(){
    alert("Hello");
  },3000);

});

score 0 · Accepted Answer

您可以执行以下操作：

$(".okbutton").click(function(event) {
    var timeout = setTimeout(function() {
        alert("Foo");
    }, 3000)
});

您可以试用工作示例。单击单词单击后，警报出现需要三秒钟。

4 回答 4