jQueryで関数が2回呼び出されるのはなぜですか？

Question

私はタイトルを持つ2枚の画像を持って、次のjQuery

$('img[title*=\"Show\"]').click(function() { 
     //$e.preventDefault();  
     var position = $('img[title*=\"Show\"]').parent().position(); 
     $('#popover').css('top', position.top + $('img[title*=\"Show\"]').parent().height() + 150); 
     console.log(position); 
     $('#popover').fadeToggle('fast'); 
     if ($('img[title*=\"Show\"]').hasClass('active')) { 
      $(this).removeClass('active'); 
     } else { 
      $('img[title*=\"Show\"]').addClass('active'); 
     } 
     }); 

を持っている「の表示オプション]を選択します。」何らかの理由で、これらのイメージのいずれかをクリックするたびに、それは2回印刷されます。私が1枚の画像しか持っていないときは、1度しか印刷されません。どうしてこれなの？作品は使用していない場合は
$(this)クリック機能の使用内部

Answer 1

代わりの$('img[title*=\"Show\"]')：

$('img[title*=\"Show\"]').click(function(e) { 
     e.stopImmediatePropagation(); 
     //other code 
    }); 

Answer 2

そのイベントではありませんので、あなたがevent.stopPropogationを使用することができ、次のコード

$('img[title*="Show"]').click(function (evt) { 
     $('#popover').hide(); 
     $('img[title*="Show"]').removeClass("active"); 
     $(this).addClass("active"); 
     var p = $(this).parent(); 
     $('#popover').css('top', p.position().top + p.height() + 150).fadeToggle('fast'); 
    }); 

Answer 3

を使用しますさらに泡立つ。たぶんあなたの機能は2つの異なるイベントからトリガーされており、他のものもバブリング中にトリガーされることがあります。