jQuery的：點擊嵌套元素

我有以下標記jQuery的：點擊嵌套元素

<ol> 
    <li class="ListItem"> 
     <span class="sub">@qItem.CategoryText</span> 
     <input type="image" src="http://icons.iconarchive.com/icons/tatice/just-bins/256/bin-red-full-icon.png" width="30" class="deleteIcon" name="QuestionId" value="@qItem.Id" /> 
    </li> 
</ol>

和下面的腳本

$(".ListItem").click(function(){ 
doActionA(); 
}); 

$(".deleteIcon").click(function(){ 
doActionB(); 
});

當我在圖片的點擊，這也觸發列表項的點擊。我明白這是因爲圖像是在ListItem中。但我希望ListItem的點擊不會在點擊圖片時被解僱。有沒有辦法做到這一點？

來源

2013-01-08 Bilal Fazlani

$(".deleteIcon").click(function(e){ 
    doActionB(); 
    e.stopPropagation(); 
});

來源

2013-01-08 06:28:35

這工作！謝謝！ –

您需要使用event.stopPropagation()來防止事件冒泡DOM樹。

$(".deleteIcon").click(function(event){ 
    event.stopPropagation() 
    doActionA();  
});

您刪除圖標綁定的事件在激發父事件與列表項綁定，所以你需要停止傳播父事件，當孩子是事件的源頭。

來源

2013-01-08 06:28:31 Adil

他想要阻止父母的單擊事件對兒童點擊時工作。你不覺得'child.stopPropagation（）'應該添加到孩子的點擊？ –

事件綁定將使子對象不會觸發父對象的事件。 – Adil

我認爲它，看看這個：http://jsfiddle.net/arvind07/WtxLC/ 嘗試評論'event.stopPropagation（）' –

$(".deleteIcon").click(function(){ 
    doActionA(); 
    return false; 
});

來源

2013-01-08 06:30:31 Anujith

使用。一（），如指向JQuery的文檔。

來源

2013-05-22 06:03:05 user2408157

$(document).on("click", ".deleteIcon", function() { 
    doActionB(); 
});

這種方法是唯一一個我發現嵌套的元素，特別是那些由庫生成的，如數據透視表（https://github.com/nicolaskruchten/pivottable）

來源

2015-08-05 16:37:15

jQuery的：點擊嵌套元素

回答

相關問題