Durch die Ereignisdelegation und die Verhinderung von Blasenbildung wird verhindert, dass das Ereignis des übergeordneten Elements_jquery auslöst

Sprechen Sie kurz über die Delegation von Ereignissen und die Vermeidung von Blasenbildung

html:

<ul class="clearfix" data-type="cityPick"> 
<li class="active_sort_opts" data-id="0">全部</li> 
<li data-id="88">纽约</li> 
<li data-id="119">洛杉矶</li> 
<li data-id="138">拉斯维加斯</li> 
<li data-id="84">夏威夷</li> 
<li data-id="120">旧金山</li> 
<li data-id="105">奥兰多</li> 
<li data-id="118">西雅图</li> 
</ul>

js:

$("ul[data-type='cityPick']").on('click',function(){ 
alert("父元素ul被点击"); 
}); 
$("ul[data-type='cityPick']").on('click','li',function(){ 
alert("子元素li被点击"); 
});

Wenn Sie auf ein bestimmtes li-Element klicken, wird festgestellt, dass auch das ul-Ereignis ausgelöst wird, was wir nicht sehen möchten.

Lösung:

$("ul[data-type='cityPick']").on('click',function(){ 
alert("父元素ul被点击"); 
}); 
$("ul[data-type='cityPick']").on('click','li',function(e){ 
e.stopPropagation();//阻止冒泡 
alert("子元素li被点击"); 
});

Fügen Sie einfach einen Satz hinzu, um das Sprudeln zu stoppen.