jQuery関数が繰り返されます

Question

私は自分のライトボックスを作っていますが、ライトボックスを閉じてもう一度電源を入れても問題はあります。ここで

は、単純な関数のコード

(function($) { 
    $.fn.lghtbx = function() { 
     var lghtbxLink = $(this); 
     lghtbxLink.click(function() { 
      $('body').append("<div id=\"ZoomGallery\"></div>"); 
      $('#ZoomGallery').css({'width': '100%','height': '100%', 'position': 'absolute', 'left': '0px', 'top': '0px', 'backgroundColor':'#000'}); 

      $('#ZoomGallery').live('click',function() { 
       $('#ZoomGallery').remove(); 
      }) 

      $(document).keydown(function(event) { 
       switch (event.keyCode) { 
        case 37://left 
        alert('left!'); 
        break; 
       } 
      }) 
     }) 
    } 
})(jQuery); 

は、私はこの

$(document).ready(function() { 
    $('.lightbox').lghtbx(); 
}); 

のように、その関数を呼び出していると私はをクリックすると、これは簡単なHTML

<a class="lightbox" href="#">a</a> 

ですキーボードのリンクを右矢印キーを押すと表示されます。それがどのように動作するはずです。しかし、黒いdivをクリックしてライトボックスを閉じると、リンクをクリックして再び開くと問題が発生します。左の矢印をクリックするたびに、私は2回警告を発しています。私がライトボックスをもう一度閉じて開いて、左の矢印を押すと、3回アラートが表示されます。

この問題を解決するのに手伝ってもらえますか？

Answer 1

まずあなたがもう一度、イベントを結合しているbecuaseの旧イベント

$(document).unbind("keydown").keydown(function(event) { 

Answer 2

を削除します。あなたはライトボックスを閉じるときに、イベントのバインドを解除する必要があります。ここに

 $('#ZoomGallery').live('click',function() { 
      $('#ZoomGallery').remove(); 
      $(document).unbind("keydown"); 
     }) 

フィドル：http://jsfiddle.net/ASS4D/