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

解決策は、実際のハンドラー関数へのハンドルを使用して setTimeout() を呼び出すだけの .click() ハンドラー関数を用意することです。

  $('.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)
});

実際の例を試すことができます。クリックという単語をクリックした後、アラートが表示されるまでに 3 秒かかります。

4 に答える 4