沒有的onclick孩子被點擊時

我有以下的html代碼：沒有的onclick孩子被點擊時

<div class="outerElement"> 
    <div class="text"> 
    Lorem ipsum dolar sit amet 
    </div> 
    <div class="attachment"> 
     <!-- Image from youtube video here --> 
    </div> 
</div>

而且我對「.outerElement」不過，我不希望「.outerElement」 onclick事件是一個jQuery onclick事件當我點擊附件時調用，是否有某種方法來防止這種情況或檢查哪個元素被點擊？

來源

2012-05-11 xorinzor

可能的重複[如何通過內部的div來防止click（）事件到jQuery中的父級div？]（http://stackoverflow.com/questions/7835775/how-to-prevent-a-click-event通過一個內部的div-to-parent-div-in-jquery）和[如何防止父母的onclick事件在點擊子錨時觸發？]（http://stackoverflow.com/questions/ 1369035 /如何防止父母的onclick事件從射擊時，當一個孩子錨是iscli）和[如何可以阻止onclick事件從父母元素髮射時，孩子被點擊？]（http://stackoverflow.com/q/985389/218196）。 –

對不起，我在谷歌和stackoverflow做了幾個搜索，但無法找到任何可以幫助我的結果。 – xorinzor

在子元素上使用event.stopPropagation()。

$(".attachment").on("click", function(event){ 
    event.stopPropagation(); 
    console.log("I was clicked, but my parent will not be."); 
});

這可以防止事件冒泡DOM到父節點。

也是event對象的一部分是target member。這將告訴你哪個元素觸發了事件開始。但是，在這種情況下，stopPropagation似乎是最佳解決方案。

$(".outerElement").on("click", function(event){ 
    console.log(event.target); 
});

來源

2012-05-11 15:35:54 Sampson

我不知道你是否能防止事件被點擊attachment項目時發射，但你一定可以過濾它

$('.outerElement').click(function() { 
    if ($(this).hasClass('attachment')) { 
    return; 
    } 
    // Handle event 
});

來源

2012-05-11 15:37:12 JaredPar

此作品，未經jQuery的

<div class="outerElement"> 
    <div class="attachment">Hello</div> 
</div> 

<script type="text/javascript"> 
document.getElementsByClassName('outerElement').onclick = function(){ 

    alert('You clicked on parent'); 

} 
document.getElementsByClassName('attachment').onclick = function(){ 

    event.stopPropagation(); 
    alert('You clicked on child'); 

} 
</script>

來源

2016-12-16 06:38:50 NicB

只需設置onclick="event.stopPropagation();"就可以了。

來源

2018-03-06 05:39:09

沒有的onclick孩子被點擊時

回答

相關問題