jQuery的點擊忽略父點擊

可能重複：
Prevent click event from affecting parent jquery jQuery的點擊忽略父點擊

我有一個類似的DOM結構：

<div class="parent"> 
    <div class="child"> 

    </div> 
</div>

我有以下的jQuery ：

$('.parent').click(function(){ 
    $(this).hide(); 
});

當點擊.child我不希望父母隱藏，但很明顯，因爲.child是.parent這個自然發生的孩子。我試着加入：

$('.child').click(function(e){ 
    e.stopPropagation(); 
});

但它仍然無法正常工作。我也嘗試用return false;替換e.stopPropagation

有什麼建議嗎？

JSFiddle

來源

2011-11-07 Lee Price

Hunderds的重複。讓我找一個。 –

真的好友，你一直在這裏等5個月？你應該已經知道如何搜索。 –

我試過搜索，但沒有解決方案。我將把我的代碼放到jsfiddle中，這樣你就可以看到自己 –

這絕對作品看我的代碼的fiddle。嘗試點擊綠色的div。如果它不適用於您的網站，那麼您還有其他問題。

來源

2011-11-07 20:39:30 topek

hmmmm，任何想法爲什麼它不能在我的小提琴中工作？ http://jsfiddle.net/mPUTe/ –

更新了你的[小提琴]（http://jsfiddle.net/mPUTe/2/）。您的問題是，當元素尚不存在時，您正在綁定點擊事件。或者，您可以使用現場活動 – topek

好的，這裏的解決方案：小提琴：http://jsfiddle.net/mPUTe/1/。
不要將事件偵聽器綁定到.pu_container。請檢查e.target在.pu_bg點擊監聽器是否有pu_container類。如果是，返回。

(function($) { 
    $.fn.show = function() { 
     return this.each(function() { 
      var link = $(this); 
      link.click(function(e) { 
       $('body').append('<div class="pu_bg">'); 
       $('.pu_bg').css({ 
        'opacity': 0.5 
       }).on('click', function(e) { 
        if($(e.target).hasClass('pu_container')) return; //<--Magic? 
        $(this).fadeOut(function(){ 
         $(this).remove();  
        }); 
       });; 
       $('.pu_bg').append('<div class="pu_container">'); 
       e.preventDefault(); 
      }); 
     }); 
    }; 
})(jQuery);

來源

2011-11-07 20:48:43

jQuery的點擊忽略父點擊

回答

相關問題