2011-09-30 18 views
5

jQuery 1.6のイベント委任では、共通の親にバブリングしたイベントに応答できます。jqueryイベントの委任変数スコープの連続呼び出し

サンプル実装は、このようなものです:

(function($){ 
    $.fn.myeventhandler = function() { 

    return this.delegate('a.next, a.prev', 'click customEvent', function (event) { 

     var target=$(event.target); 
     var bar = null; 

     if('click' == event.type) {    /*~[ call this 'a' ]~*/ 

      // handle the click event 
      $('#next-element').animate({width:'200px'},1300,function(){ 
      bar = 'value1'; 
      $('#next-element').animate({width:'100px'},1300,function(){ 
       bar = 'value2'; 
       console.log(bar); 
      }); 
      }); 

     } else if('customEvent' == event.type) { /*~[ call this 'b' ]~*/ 

      // handle the customEvent event 
      $('#my-element').animate({height:'200px'},1300,function(){ 
      bar = 'my-event1'; 
      console.log(bar); 
      }); 

     } 

     return false; 
    }); 
    } 
})(jQuery); 

あなたは多くのイベントは、ページ上に結合しているしたいトリガーがある場合この種の構造は本当によく働くことができます。しかし、私は好奇心をそそる行動に気づき、誰かが私に次のようなことを教えてくれるか疑問に思っています:

'a'の前に変数 'var bar;'を定義して 'a'と 'a'実行に時間がかかる場合、 'クリック'が2回目にトリガされた場合、 'bar'変数に値が再割り当てされるか、新しいものが作成されますか?

質問の理由は、アニメーションが完了するのに1.3秒かかる「未完成の」アニメーションがあることです。 2つの連続したクリックイベントをトリガーすると、ターゲットとタイプは正しく設定されますが、2番目のアニメーションは最初のアニメーションに影響しているように見え、2つのスコープはお互いに利用できるように見えます。

私はまだアニメーションを終了していないので、jsFiddleでオンラインにする作業セットがありませんでしたが、ここでは範囲を知るためのルールがあります。誰かが見つかりましたか?

EDIT:上記で 、私は私が使用しているものに似たような状況に追加しました。上の単純化されたケースでは、 'bar'の値は2回の連続したコールで期待値を保持しますが、コールバック関数にパラメータを特に渡さない限り、私はまだ作業中です。 2つの連続した呼び出しがパラメータの値を変更して、コールバックがそれ自身の起動された呼び出しで論理的に設定された値ではなく、後続の呼び出しによって作成された値を参照できるようにする条件。誰かが簡単な例でこの効果を再現できる場合、私はそれを感謝します。私はそれを複製するjsFiddleを生成しようとするために私の関数を切っています。イベントオブジェクトの周りに渡される代わりに、新たに様々なイベントを使用して作成されて

おかげで、 AE

+0

「a」とは何ですか? ? ? –

+0

こんにちは、Interstellar_Coder、コメントの 'a'は最初のif()ブロックを参照し、 'b'はコードの 'else'ブロックを参照しています - コメントが役に立たなかったら残念です。 ? – MyStream

答えて

1

2回目にクリックすると新しいバー変数が作成され、両方のバー値は互いに独立しています。これを実際に見るには、私はfiddleを作成しました。速く2回クリックすると、2番目の時間バーは初期値をとり、最初のバー変数が持つ値ではなく、予想通りです。

+0

これは良い例です(外部変数との関係をより詳細に合わせるために少し編集されています)スコープ)を設定してください。私はそれを引き起こすために何をしたのかまだ見ていませんが、スコープの問題よりもエラーのようです。スコープ自体を拡張して、各イベントトリガーで何が起こるかをすべて説明できますか?自己完結型ですか? – MyStream

0

、したがって、「」再割り当てすることはないだろうが、両方のイベントアクションによって影響を受けるであろう。

+0

こんにちは@スワツキン、私はあなたが何を意味したかはわかりません。興味深いことに、http://jsfiddle.net/BHaEj/4/リンク(変更)は、2番目のイベントが来たときにbar変数がblitzedされていないことを示しています。コードではまだ終了していませんが、後続の呼び出しでifループの変数に影響を与えることができます。変数名に別の名前を付けて、別の問題があるかどうかを確認します。 – MyStream

+0

まあ、フィドルでは、あなたはグローバルスペースに 'count'を持っています。だから、イベントオブジェクトには結びついていません。イベントオブジェクトは 'count'を変更しています。そのため、このフィドルが期待どおりに動作しています。ただし、クリックアクションのコールバック関数内で 'count'を宣言すると、クリックが発生するたびに再宣言されます。イベントオブジェクト自体は(プロパティの値が異なる)同じですが、宣言された特定の変数は各アクションで再宣言されます。 jQueryイベントオブジェクトのドキュメントを以下に示します。http://api.jquery.com/category/events/event-object/ – swatkins

関連する問題