解除事件綁定的方法:1、使用unbind()和undelegate()方法,分別用來解除由bind()和delegate()方法所綁定的事件;2、使用off()方法,可以解除由on()、bind()和delegate()方法所綁定的事件。
本教學操作環境:windows7系統、jQuery1.7版,此方法適用於所有品牌電腦。
相關推薦:《jQuery影片教學》
#解除事件綁定
在元素綁定事件之後,當在某個時刻不再需要該事件處理時,可以解除所綁定的事件。在jQuery中提供了unbind()和undelegate()方法,分別用於解除由bind()和delegate()方法所綁定的事件,透過參數指明需要解除的綁定事件即可。當方法沒有提供參數時,表示解除該元素所有的事件綁定。
在jQuery1.7 中提供了off()方法,用於解除由on()、bind()和delegate()方法所綁定的事件。 off()方法與on完全相同。
範例:解除事件綁定
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>
更多程式相關知識,請造訪:程式設計課程! !
以上是jquery如何解除事件綁定?的詳細內容。更多資訊請關注PHP中文網其他相關文章!