Heim  >  Artikel  >  Web-Frontend  >  Wie entbinde ich Ereignisse in JQuery?

Wie entbinde ich Ereignisse in JQuery?

青灯夜游
青灯夜游Original
2020-11-26 10:02:464059Durchsuche

Methoden zum Aufheben der Bindung von Ereignissen: 1. Verwenden Sie die Methoden unbind() und undelegate(), um die Bindung von Ereignissen aufzuheben, die durch die Methoden bind() bzw. Delegate() gebunden sind. 2. Verwenden Sie die Methode off(), um die Bindung von Ereignissen aufzuheben, die durch on( ), bind()- und Delegate()-Methoden.

Wie entbinde ich Ereignisse in JQuery?

Die Betriebsumgebung dieses Tutorials: Windows 7-System, jQuery Version 1.7. Diese Methode ist für alle Computermarken geeignet.

Verwandte Empfehlungen: „jQuery-Video-Tutorial

Bindung des Ereignisses aufheben

Nachdem das Element an das Ereignis gebunden ist und die Ereignisverarbeitung zu einem bestimmten Zeitpunkt nicht mehr benötigt wird, können Sie die Bindung des Ereignisses aufheben Ereignis. jQuery stellt die Methoden unbind() und undelegate() bereit, die zum Aufheben der Bindung von Ereignissen verwendet werden, die durch die Methoden bind() bzw. Delegate() gebunden sind. Geben Sie einfach die gebundenen Ereignisse an, die aufgehoben werden müssen, über die Parameter. Wenn die Methode keine Parameter bereitstellt, bedeutet dies, dass die Bindung aller Ereignisse des Elements aufgehoben wird.

Die Methode off() wird in jQuery 1.7+ bereitgestellt und dient zum Freigeben von Ereignissen, die durch die Methoden on(), bind() und delegate() gebunden sind. Die Methode off() ist genau die gleiche wie on.

Beispiel: Unbinding-Event

nbsp;html>
  
	<meta>
	<title>jQuery基本操作事件绑定</title>
	<script> </script>
   	<style>
		p{width:200px;height:200px;border:1px solid #666;}
		#leftp{float:left; margin:0 auto;}
		#rightp{float:right;}
	</style>
  
  
  	<p>
    	<input>
        <input>
        <input>
        <input>
    </p>
    <p>右侧展示区</p>
	<script>
		$(function(){
			//使用bind()方法绑定事件
			$("#manyBindBtn").bind({
				click:function(){$("#rightp").slideToggle();},
				mouseover:function(){$("#rightp").css("background-color","red");},
				mouseout:function(){$("#rightp").css("background-color","yellow");}
			});
			//使用delegate()方法绑定事件
			$(document).delegate("#delegateBindBtn","click",function(){
				$("#rightp").slideToggle();
			});
			//使用hover()方法绑定事件
			$("#rightp").hover(function(){
				$(this).css("background-color","gray");
			},function(){
				$(this).css("background-color","white");
			});
			//使用on()方法绑定事件
			$("#leftp").on("click","#bindBtn", function(){
				alert("使用bind()方法绑定事件处理");
			});
			//解除事件绑定
			$("#removeBindBtn").on("click",function(){
				//1.使用unbind()解除click事件绑定
				//$("#manyBindBtn").unbind("click");
				//2.使用unbind()解除该元素上的所有事件绑定
				//$("#manyBindBtn").unbind();
				//3.使用off()方法解除bind()方法的click事件绑定
				$("#manyBindBtn").off("click");
				//$(document).off("click","#manyBindBtn");
				//4.使用off()方法解除该元素上的所有事件绑
				//$("#manyBindBtn").off();				
				//5.使用undelegate()方法解除delegate()方法绑定事件
				//$(document).undelegate("#delegateBindBtn","click");
				//6.使用off()方法解除delegate()方法绑定事件
				$(document).off("click","#delegateBindBtn");
				//7.使用off()方法解除on()方法的click事件绑定
				$("#leftp").off("click","#bindBtn");
				//8.使用off()方法解除所有按钮上的所有事件绑定
				$("input[type=button]").off();
			});
		});
	</script>
  

Wie entbinde ich Ereignisse in JQuery?

Weitere Programmierkenntnisse finden Sie unter: Programmierkurs! !

Das obige ist der detaillierte Inhalt vonWie entbinde ich Ereignisse in JQuery?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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