jQuery 移除事件的方法
在繫結事件的過程中，不僅可以為同一個元素繫結多個事件，也可以為多個元素繫結同一個事件。假設網頁上有一個<button>元素，使用以下程式碼為該元素繫結多個相同的事件。
<script type="text/javascript">
$(function(){
$('#btn').bind("click",function(){
$('#test').append("<p>我的繫結函式1</p>");
}).bind("click",function(){
$('#test').append("<p>我的繫結函式2</p>");
}).bind("click",function(){
$('#test').append("<p>我的繫結函式3</p>");
});
})
</script>
<body>
<button id="btn">點選我</button>
<div id="test"></div>
</body>
當單擊按鈕後，會出現如上圖所示的效果。
1. 移除按鈕元素上所有註冊的事件
新增一個移除事件的按鈕。然後為按鈕繫結一個事件，程式碼如下：
<script type="text/javascript">
$(function(){
$('#btn').bind("click",function(){
$('#test').append("<p>我的繫結函式3</p>");
});
$('#delAll').click(function(){
$('#btn').unbind("click");
});
})
</script>
<body>
<button id="btn">點選我</button>
<div id="test"></div>
<button id="delAll">刪除所有事件</button>
</body>因為元素繫結的都是 click 事件，所以不寫引數也可以達到同樣的目的。
$('#delAll').click(function(){
$('#btn').unbind();
});
下面來看看 unbind() 方法的語法結構：unbind([type],[data]);
第1個引數是事件型別，第2個引數是將要移除的函式，具體說明如下。
(1) 如果沒有引數，則刪除所有繫結的事件。
(2) 如果提供了事件型別作為引數，則只刪除該型別的繫結事件。
(3) 如果把在繫結時傳遞的處理函式作為第2個引數，則只有這個特定的事件處理函式會被刪除。
2. 移除<button>元素的其中一個事件
首先需要為這些匿名處理函式指定一個變數。然後就可以單獨刪除某一個事件了， jQuery 程式碼如下：
<script type="text/javascript">
$(function(){
$('#btn').bind("click",myFun1 = function(){
$('#test').append("<p>我的繫結函式1</p>");
}).bind("click",myFun2 = function(){
$('#test').append("<p>我的繫結函式2</p>");
}).bind("click",myFun3 = function(){
$('#test').append("<p>我的繫結函式3</p>");
});
$('#delTwo').click(function(){
$('#btn').unbind("click",myFun2);
});
})
</script>
<body>
<button id="btn">點選我</button>
<div id="test"></div>
<button id="delTwo">刪除第二個事件</button>
</body>
當單擊“刪除第二個事件”按鈕後，再次單擊“點選我”按鈕，顯示下圖所示的效果。
另外，對於只需要觸發一次，隨後就要立即解除繫結的情況，jQuery 提供了一種簡寫方法——one() 方法。 one() 方法可以為元素繫結處理函式。當處理函式觸發一次後，立即被刪除。即在每個物件上，事件處理函式只會被執行一次。
one() 方法的結構與 bind() 方法類似，使用方法也與 bind() 方法相同，其語法結構如下：one( type,[data],fn )；
示例程式碼如下：
<script type="text/javascript">
$(function(){
$('#btn').one("click",function(){
$('#test').append("<p>我的繫結函式1</p>");
}).one("click",function(){
$('#test').append("<p>我的繫結函式2</p>");
}).one("click",function(){
$('#test').append("<p>我的繫結函式3</p>");
});
})
</script>
<body>
<button id="btn">點選我</button>
<div id="test"></div>
</body>
使用one() 方法為<button>元素繫結單擊事件後，只在使用者第1次單擊按鈕時，處理函式才執行，之後的單擊毫無作用。
以上就是jQuery 移除事件的方法的詳細內容，更多關於jQuery 移除事件的資料請關注我們其它相關文章！