Heim > Web-Frontend > js-Tutorial > Die spezifische Implementierungsmethode zum Verhindern des Anhängens von Ereignissen in js

Die spezifische Implementierungsmethode zum Verhindern des Anhängens von Ereignissen in js

怪我咯
Freigeben: 2017-07-06 11:35:39
Original
1895 Leute haben es durchsucht

Sie können e.stopPropagation(); e.preventDefault(); verwenden, um zu verhindern, dass das -Ereignis sprudelt und das Standardereignis ausgeführt wird. Wenn Sie jedoch das Hinzufügen von Ereignissen verhindern möchten, sehen Sie sich bitte die Implementierungsmethode unten an.

Manchmal können Sie e.stopPropagation(); verwenden, um das Sprudeln von Ereignissen zu verhindern von Standardereignissen. Es kann jedoch nicht verhindern, dass das Ereignis hinzugefügt wird.

Unter welchen Umständen sollten wir das Hinzufügen von Ereignissen verhindern?

Zum Beispiel:

Klicken Sie dabei auf „Zur Kasse gehen“. Der Checkout selbst hat sein eigenes Ereignis, aber Sie müssen festlegen, ob Sie sich vor dem Checkout anmelden möchten.

Wir könnten so schreiben:

Js-Code

Der Code lautet wie folgt:

if(isLogin){ //判断是否登录 
console.log("没有登录") 
}else{ 
//结账相关代码 
}
如果点击“我的主页”也有登录判断
登录判断代码
if(isLogin){ //判断是否登录 
console.log("没有登录") 
}else{ 
//个人中心 
}
Nach dem Login kopieren

Wenn es weitere Login-Urteile gibt . Wird es mehr Code wie den oben genannten geben? Später entdeckte ich die Methode stopImmediatePropagation(), um das Anhängen von Ereignissen zu verhindern. Das obige Problem ist kein Problem mehr.

Wichtig: Stellen Sie sicher, dass das Login-Beurteilungsereignis das erste gebundene Ereignis ist.

Democode

Der Code lautet wie folgt:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>demo</title> 
<script src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script> 
</head> 
<body> 

<a href="#" class="bill isLogin">结账 </a> 


<ul> 
<li class="a1 isLogin">加入收藏夹</li> 
<li class="a2 isLogin">他人支付</li> 
<li>加入购入车</li> 
<li class="a4 isLogin">我的主页</li> 
</ul> 

<script> 
//最先绑定 
$(".isLogin").on("click", function (e) { 

if(true){ //登录判断 
alert("没有登录"); 
e.stopImmediatePropagation(); 
} 

return false; 
}); 

$(".bill").on("click",function(){ 
alert("结账相关内容!"); 
}); 

$(".a1").on("click",function(){ 
alert("a1"); 
}); 

$(".a2").on("click",function(){ 
alert("a2"); 
}); 

$(".a3").on("click",function(){ 
alert("已加入购物车"); 
}); 

$(".a4").on("click",function(){ 
alert("有登录判断"); 
}); 


</script> 
</body> 
</html>
Nach dem Login kopieren

Tatsächlich bietet uns jquery eine Möglichkeit, Ereignisse anzuzeigen $._data($( '.isLogin' ).get(0)), öffnen Sie Firebug und geben Sie in die Konsole ein.
Js-Code

$._data($('.isLogin').get(0))

sieht Folgendes:

Js-Code

Object { events={...}, handle=function()}

Klicken Sie hier, um das Ereignis-Array anzuzeigen und Bindungen an Elementen einfach anzuzeigen Was für ein Ereignis ist passiert.

Das obige ist der detaillierte Inhalt vonDie spezifische Implementierungsmethode zum Verhindern des Anhängens von Ereignissen in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage