專案在測試階段，頁面中有這麼一個bug，繫結的單擊事件，單擊一次，卻觸發了兩次單擊的響應。

網上搜了一下相關的資料，發現是js中繫結的事件太多了，使用的是 .on()，在這裡需要使用 .off()進行解綁即可。

off()函式用於移除元素上繫結的一個或多個事件的事件處理函式。

off()函式主要用於解除由on()函式繫結的事件處理函式。

該函式屬於jQuery物件(例項)。

語法

jQuery 1.7 新增該函式。其主要有以下兩種形式的用法：

用法一：

jQueryObject.off([ events [, selector ][, handler 
 
]])

用法二：

jQueryObject.off( eventsMap [, selector ])

引數

off()函式將會移除當前匹配元素上為後代元素selector繫結的events事件的事件處理函式handler。

如果省略引數selector，則移除為任何元素繫結的事件處理函式。

引數selector必須與通過on()函式新增繫結時傳入的選擇器一致。

如果省略引數handler，則移除指定元素指定事件型別上繫結的所有事件處理函式。

如果省略了所有引數，則表示移除當前元素上為任何元素繫結的任何事件型別的任何事件處理函式。

返回值

off()函式的返回值為jQuery型別，返回當前jQuery物件本身。

實際上，off()函式的引數全是篩選條件，只有匹配所有引數條件的事件處理函式才會被移除。引數越多，限定條件就越多，被移除的範圍就越小。

示例&說明

請參考下面這段初始HTML程式碼：

<inputid="btn1"type="button"value="點選1"/><inputid="btn2"type="button"value="點選2"/><aid="a1"href="#">CodePlayer</a>

首先，我們為上述button和<a>元素繫結事件，然後使用off()函式解除事件繫結，相應的程式碼如下：

function btnClick1(){
    alert(this.value +"-1");}function btnClick2(){
    alert(this.value +"-2");}var $body = $("body");// 為所有button元素的click事件繫結事件處理函式btnClick1
$body.on("click",":button", btnClick1 );// 為所有button元素的click事件繫結事件處理函式btnClick2
$body.on("click",":button", btnClick2 );//為所有a元素繫結click、mouseover、mouseleave事件
$body.on("click mouseover mouseleave","a",function(event){if( event.type =="click"){
        alert("點選事件");}elseif( event.type =="mouseover"){
        $(this).css("color","red");}else{
        $(this).css("color","blue");}});// 移除body元素為所有button元素的click事件繫結的事件處理函式btnClick2// 點選按鈕，btnClick1照樣執行
$body.off("click",":button", btnClick2);// 移除body元素為所有button元素的click事件繫結的所有事件處理函式(btnClick1和btnClick2)// 點選按鈕，不會執行任何事件處理函式// $body.off("click", ":button");// 注意： $body.off("click", "#btn1"); 無法移除btn1的點選事件，off()函式指定的選擇器必須與on()函式傳入的選擇器一致。// 移除body元素為所有元素(包括button和<a>元素)的click事件繫結的所有處理函式// 點選按鈕或連結，都不會觸發執行任何事件處理函式// $("body").off("click");// 移除body元素為所有元素的任何事件繫結的所有處理函式// 點選按鈕，或點選連結或者滑鼠移入/移出連結，都不會觸發執行任何事件處理函式// $("body").off( );

執行程式碼(其他程式碼請自行復制到演示頁面執行)

此外off()函式還可以只移除指定名稱空間的事件繫結。

var $btn1 = $("#btn1");

$btn1.on("click.foo.bar",function(event){
    alert("click-1");});
$btn1.on("click.test",function(event){
    alert("click-2");});
$btn1.on("click.test.foo",function(event){
    alert("click-3");});

$btn1.off("click.test");// 移除click-2、click-3// $btn1.off("click.foo");  // 移除click-1、click-3// $btn1.off("click.foo.bar");  // 移除click-1// $btn1.off("click");  // 移除所有click事件處理函式(click-1、click-2、click-3)// $btn1.off(".foo");  // 移除所有包含名稱空間foo的事件處理函式，不僅僅是click事件