19

要素にクリック イベント ハンドラーを追加する

 $(".elem").click(function(){
       $.post("page.php".function(){
         //code1
      })
 })

そして、クリックイベントをトリガーします

$(".elem").click();
//code2

code1 の実行後に code2 が実行されるようにするにはどうすればよいですか

4

4 に答える 4

17

(WebWorkers を無視) JavaScript は単一のスレッドで実行されるため、常に code1 の後に code2 が実行されることを確認できます。

コード 1 が Ajax 呼び出しや のような非同期処理を行わない限りsetTimeout()、トリガーされたクリック ハンドラーが完了すると、コード 2 が実行され、(最終的に) Ajax 呼び出し (または など) からのコールバックsetTimeout()が実行されます。

編集:更新された質問については、上記で述べたように、非同期 Ajax コールバックが後で発生するため、code2 は常に code1 の前に実行されます (Ajax 応答が非常に高速であっても、現在の JS が終了するまでコールバックは呼び出されません)。

「code1 の実行後に code2 が実行されるようにする方法」

.click()params なしで使用すると へのショートカットになり.trigger("click")ますが、実際に.trigger()明示的に呼び出す場合は、ハンドラーに渡される追加のパラメーターを指定できます。これにより、次のことが可能になります。

$(".elem").click(function(e, callback) {
    $.post("page.php".function(){
      //code1

      if (typeof callback === "function")
         callback();
   });
});

$(".elem").trigger("click", function() {
    // code 2 here
});

つまり、クリック ハンドラー内で、関数がcallbackパラメーターに渡されているかどうかをテストし、渡されている場合はそれを呼び出します。つまり、イベントが「自然に」発生した場合、コールバックはありませんが、プログラムでトリガーして関数を渡すと、その関数が実行されます。(渡すパラメーター.trigger()は関数である必要はありません。任意の型のデータにすることができ、複数のパラメーターを渡すことができますが、この目的のためには関数が必要です。詳細については、.trigger()ドキュメントを参照してください。)

デモ: http://jsfiddle.net/nnnnnn/ZbRJ7/1/

于 2012-08-03T06:15:44.700 に答える
3

このように書いてみることができます:

 $(".elem").live("click", function(){
  //code1
 })

 // for newer jquery version from 1.9
 $(".elem").on("click", function(){
  //code1
 })

そして、トリガーは常に起動されたとおりに実行されます。

于 2012-08-03T06:17:49.883 に答える
3

メソッドをラップcode2し、コールバックとして内部に追加して、実行code1後に常に呼び出されるようにしますcode1

code2 = function(){/*code2*/};
$(".elem").click(function(){
  //code1
  code2();
 })
于 2012-08-03T06:19:29.870 に答える
-3

Javascriptの実行は1行ずつです。したがって、発生したものはすべて、最初に実行されます。したがって、他の方法が機能する前にクリックコードを追加します。

さらに、非同期呼び出しがある場合は、応答を受け取ったときにのみ設定されるフラグを取ります。

var clicked = false; $（'＃elem'）。click（function（）{//非同期プロセスを実行しますclicked = true;}）;

while（！clicked）{//何もしない}

//呼び出される他の関数

または、postメソッドを使用する場合、2番目のオプションはプロパティでasync=trueを設定します。

于 2012-08-03T06:57:51.793 に答える