[英]Same click event to trigger on parent and child
我有一個導航結構,其中html元素具有父子關系。
<div id="navigationStructure">
<div class="addId">
<ol class="sortable ui-sortable">
<!----------Parent li for navigation ----------->
<li data-title="Home" data-link="" data-target="_self" class="item_0">
<div class="active">
Home
</div>
<ol>
<!----- CHILD li 1----------->
<li data-title="About" data-link="" data-target="_self" style="display: list-item;" class="item_1">
<div class="">
About
</div>
</li>
<!--------- CHILD li 2------------>
<li data-title="Products" data-link="" data-target="_self" style="display: list-item;" class="item_2">
<div class="">
Products
</div>
</li>
</ol>
</li>
<li data-title="Category" data-link="" data-target="_self" class="item_3">
<div>
Category
</div>
<ol>
<li data-title="Contact" data-link="" data-target="_self" style="display: list-item;" class="item_4">
<div>
Contact
</div>
</li>
</ol>
</li>
</ol>
</div>
我正在嘗試編寫一個函數,以在單擊父級或子級時觸發並選擇它。
$('#popUpComponentSetting').on("click","#navigationStructure li", function() {
$('#navigationStructure ol li div').removeClass('active');
$('> div',this).addClass('active');
navId = $(this).attr('class');
.....
})
現在,如果我單擊孩子,它將觸發兩次,一次觸發給父母,另一次觸發給孩子。
我經過這里的線程,但是我想要一些不同的東西。 我需要有一個對父母和孩子都適用的事件
使用event.stopPropgation()
停止通過DOM樹冒泡事件,
$('#popUpComponentSetting').on("click","#navigationStructure li", function(e) {
e.stopPropagation();
//rest of your code
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.