溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關jquery解除事件綁定的方法，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
解除事件綁定的方法：1、使用unbind()和undelegate()方法，分別用于解除由bind()和delegate()方法所綁定的事件；2、使用off()方法，可以解除由on()、bind()和delegate()方法所綁定的事件。
解除事件綁定
在元素綁定事件之后，當在某個時刻不再需要該事件處理時，可以解除所綁定的事件。在jQuery中提供了unbind()和undelegate()方法，分別用于解除由bind()和delegate()方法所綁定的事件，通過參數指明需要解除的綁定事件即可。當方法沒有提供參數時，表示解除該元素所有的事件綁定。
在jQuery1.7+中提供了off()方法，用于解除由on()、bind()和delegate()方法所綁定的事件。off()方法與on完全相同。
示例：解除事件綁定
<!doctype html><html>
<head>
<meta charset="utf-8">
<title>jQuery基本操作事件綁定</title>
<script type="text/javascript" src="js/jquery-1.7.js"> </script>
<style type="text/css">
p{width:200px;height:200px;border:1px solid #666;}
#leftp{float:left; margin:0 auto;}
#rightp{float:right;}
</style>
</head>
<body>
<p id="leftp">
<input type="button" value="bind事件綁定" id="bindBtn"/>
<input type="button" value="多事件綁定" id="manyBindBtn"/>
<input type="button" value="delegate事件綁定" id="delegateBindBtn"/>
<input type="button" value="解除事件綁定" id="removeBindBtn"/>
</p>
<p id="rightp">右側展示區</p>
<script type="text/javascript">
$(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>
</body></html>
關于jquery解除事件綁定的方法就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
