クリック後のみmousemoveイベントを初期化する

Question

私は、キャンバスのdivでマウスをクリックすると選択マーキーボックスを作成するプラグインを作成しています。これまでのところ、click()とmousemove()というイベントをコードに入れてプラグインを作成しました（他のイベントの中にイベントを埋め込む方法はわかりません）。しかし、これは、マウスがクリックの前にキャンバス上を移動するときに問題になります。誰でもクリックでmousemoveハンドラを初期化する方法を知っていますか？

$.fn.createBox = function(id) { 
     $(id).css({ 
      cursor:'crosshair' 
     }); 

     $(id).click(function(e) { 
      var clickLocX = e.pageX; 
      var clickLocY = e.pageY; 
      $('<div>').attr({ 
       'class':'newBox', 
       'ctr':'on' 
      }) 
      .css({ 
       top:clickLocY, 
       left:clickLocX 
      }) 
      .appendTo(id); 
     }); 
     //Mousemove must be initialized only AFTER the click. HOW TO DO THIS? 
     $(id).mousemove(function(e){ 
      var XpageCoord = e.pageX; 
      var YpageCoord = e.pageY; 
       window.Xloc = XpageCoord; 
       window.Yloc = YpageCoord; 
      var boxOffset = $('.newBox').offset(); 
      var boxHeight = YpageCoord - boxOffset.top; 
      var boxWidth = XpageCoord - boxOffset.left; 

      $('.newBox').css({ 
       height:boxHeight + 'px', 
       width:boxWidth + 'px' 
      }); 
     }); 
    } 

Answer 1

ちょうどclickハンドラ内からmousemoveハンドラを設定し、すでに追加しないように設定されているかどうかを判断するためのフラグを使用します。ここでは

は私がこれまでに書いたコードですそれは複数回です。

EDIT：例

assignedMoveHandler = false; 
$(id).click(function(e) { 
    // other stuff... 
    if(!assignedMoveHandler) { 
     $(id).mousemove(function(e) { 
      // mouse move handling code...     
     }); 
     assignedMoveHandler = true; 
    } 
} 

は、私はあなたがまたはそれを少しクリーンアップすることができるよう、私は、など、二回jQueryオブジェクトをルックアップを気にしてもしなくてもよい、ここでグローバルを使用しますが、この一般的な考えです。 clickハンドラが起動すると、まだmousemoveハンドラが割り当てられているかどうかを確認します。そうでない場合は、割り当てます。