このjavascriptの動作に関する誤解

Question

クライアント側のチャネルにイベントをバインドし、サーバーからのメッセージを待機し、コールバックで匿名機能を起動し、メッセージデータをthingパラメータで渡します。

channel.bind('coordinates_sent', function(thing) { 
    var x = thing.left; 
    var y = thing.top; 

    $(window).scroll(function(){ 
      alert(x + " " + y); 
    }); 

    alert(x + " " + y); 
}); 

scrollメソッド以外の警告メッセージは期待通りに機能します。新しいメッセージが到着したときにサーバーから送信されたデータの新しいx座標とy座標を警告します。

ただし、スクロールメッセージ内のアラートメッセージは、予想どおりに動作しません。 1つのメッセージがイベントリスナーに送信されている場合、スクロールするたびにそのアラートはそのメッセージのx座標とy座標を正しく表示します。ただし、別のメッセージが入力された場合は、アラートに最初のメッセージの最初のxとy座標が表示され、別のアラートで最新のメッセージのxとy座標が表示されます。

なぜこれが起こっているのか理解できません。

Answer 1

サーバーからメッセージを受信するたびに、新しいscrollイベントハンドラが追加されます。イベントリスナーをアタッチすると、既存のリスナーはでなく、が削除されます。ユーザーがスクロールすると、接続されているすべてのイベントハンドラーが実行されます。この問題を解決するには

、それはサーバによって受信されたメッセージのためのイベントハンドラの外scrollイベントを取り付ける部分を動かす：

var x, y; 
channel.bind('coordinates_sent', function(thing) { 
    x = thing.left; 
    y = thing.top; 

    alert(x + " " + y); 
}); 
$(window).scroll(function(){ 
    alert(x + " " + y); 
}); 

Answer 2

jQueryの.bind（）メソッドハンドラを登録するが、doesntのは、それらをアンバインド。代わりに.one（）を使用してください。hereを参照してください。