JQuery入門——移除綁定事件unbind方法概述及應(yīng)用
更新時(shí)間：2013年02月05日 15:49:50 作者：
在DOM對(duì)象的實(shí)踐操作中,存在用于綁定事件的bind方法,也會(huì)有相應(yīng)的移除綁定事件unbind方法，接下來將介紹unbind方法的使用，感興趣的朋友可以不要錯(cuò)過了啊，或許本文對(duì)你有所幫助
1、在DOM對(duì)象的實(shí)踐操作中，既然存在用于綁定事件的bind方法，也相應(yīng)存在用于移出綁定事件的方法，在JQuery中，可以通過unbind方法移除所有綁定的事件或某一個(gè)事件。
2、示例代碼：
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>unbind方法移除綁定事件</title>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
function oClick(){ //自定義事件
$("#divTip").append("<div>這是按鈕二綁定的事件</div>");
};
$("input:eq(0)").bind("click",function(){
$("#divTip").append("<div>這是按鈕一綁定事件</div>");
});
$("input:eq(1)").bind("click",oClick);
$("input:eq(2)").bind("click",function(){
$("input").unbind("click",oClick);
$("#divTip").append("<div>刪除按鈕二事件</div>");
});
$("input:eq(3)").bind("click",function(){
$("input").unbind();
$("#divTip").append("<div>移出所有按鈕綁定的事件</div>");
});
})
</script>
</head>
<body>
<div>
<input id="button1" class="btn" value="按鈕一" type="button"/>
<input id="button2" type="button" value="按鈕二" class="btn"/>
<input id="button3" type="button" value="刪除按鈕二事件" class="btn"/>
<input id="button4" type="button" value="刪除所有事件" class="btn"/>
</div>
<div id="divTip"></div>
</body>
</html>
3、效果圖預(yù)覽：
點(diǎn)擊按鈕一和按鈕二：
點(diǎn)擊刪除按鈕二事件在點(diǎn)擊按鈕二無反應(yīng)點(diǎn)擊按鈕一有反應(yīng)：
點(diǎn)擊刪除所有事件后點(diǎn)擊所有按鈕無反應(yīng)：
您可能感興趣的文章:
- JQuery中綁定事件（bind()）和移除事件（unbind()）
- jQuery中的bind綁定事件與文本框改變事件的臨時(shí)解決方法
- jQuery中對(duì)未來的元素綁定事件用bind、live or on
- jQuery事件綁定on()、bind()與delegate() 方法詳解
- 解析jQuery的三種bind/One/Live事件綁定使用方法
- jquery bind(click)傳參讓列表中每行綁定一個(gè)事件
- jQuery綁定事件監(jiān)聽bind和移除事件監(jiān)聽unbind用法實(shí)例詳解
- JQuery入門——用bind方法綁定事件處理函數(shù)應(yīng)用介紹
- jQuery中bind(),live(),delegate(),on()綁定事件方法實(shí)例詳解
- jQuery中的on與bind綁定事件區(qū)別實(shí)例詳解
- jQuery中綁定事件bind() on() live() one()的異同
- jQuery使用bind函數(shù)實(shí)現(xiàn)綁定多個(gè)事件的方法
相關(guān)文章
用jQuery來判斷瀏覽器的類型,主要是使用$.browser這個(gè)工具類2011-04-04
jquery.uploadifive插件怎么解決上傳限制圖片或文件大小問題
jQuery.uploadifive插件可以很好的解決上傳限制圖片或文件大小問題,具體實(shí)例代碼大家參考下本文2017-05-05
jQuery oLoader實(shí)現(xiàn)的加載圖片和頁面效果
我們使用jQuery的ajax在頁面中就像使用iframe一樣加載其他頁面內(nèi)容，今天我給大家分享一個(gè)名叫jQuery oLoader的插件，該插件還集成了oPageLoader，可以輕松實(shí)現(xiàn)加載圖片和頁面的漂亮效果。2015-03-03
這篇文章主要介紹了jQuery實(shí)現(xiàn)幻樹形下拉菜單特效，代碼簡單，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2015-08-08
jQuery控制input只能輸入數(shù)字和兩位小數(shù)的方法
這篇文章主要介紹了jQuery控制input只能輸入數(shù)字和兩位小數(shù)的相關(guān)知識(shí)，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-05-05
jQuery實(shí)現(xiàn)輸入框下拉列表樹插件特效代碼分享
這篇文章主要介紹了jQuery實(shí)現(xiàn)輸入框下拉列表樹特效，推薦給大家，有需要的小伙伴可以參考下。2015-08-08
jQuery+SpringMVC中的復(fù)選框選擇與傳值實(shí)例
下面小編就為大家分享一篇jQuery+SpringMVC中的復(fù)選框選擇與傳值實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-01-01
在jquery中給表單取值或賦值的方法我們只要簡單的$(\'表單ID\').val()即可實(shí)現(xiàn)取值了，如果賦值我們可使用$(\'表單ID\').val(\'內(nèi)容\')即可實(shí)現(xiàn)了2013-08-08
jquery 頁眉單行信息滾動(dòng)顯示實(shí)現(xiàn)思路及代碼
將滾動(dòng)的內(nèi)容查詢出來，放在一個(gè)div 或者別的容器里面，具體的實(shí)現(xiàn)代碼如下2014-06-06
jQuery實(shí)現(xiàn)類似標(biāo)簽風(fēng)格的導(dǎo)航菜單效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)類似標(biāo)簽風(fēng)格的導(dǎo)航菜單效果代碼,涉及jquery鼠標(biāo)事件操作頁面元素的遍歷與樣式動(dòng)態(tài)修改技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08