首頁 >web前端 >js教程 >JQuery中綁定事件(bind())和移除事件(unbind())_jquery

JQuery中綁定事件(bind())和移除事件(unbind())_jquery

WBOY
WBOY原創
2016-05-16 16:12:301229瀏覽

有時候事件執行完了,想取消事件的效果可以用一定的辦法來處理。例如bind()(綁定事件)和unbind()(移除透過bind()方法新增的事件)方法來移除事件的效果。

例如下面的案例:

複製程式碼 程式碼如下:


html部分:

複製程式碼 程式碼如下:


   
   


當點擊按鈕btn時,觸發了三個點擊事件,這裡的append()方法,向div層中傳遞了三個段落內容。

        append() 方法在被選元素的結尾(仍在內部)被追加指定內容。它與html()方法還是不同的,html()方法是改變整個元素中的內容,而不是向元素結尾追加內容。 text()方法與html()方法類似,但差異在於html()方法中可以寫入html的程式碼,而且可以被正確的解析,而text()只能當html程式碼為正常的字串。

這裡每次點擊,都會執行一次事件,想div層末尾加入段落。下面的程式碼是取消事件效果的,可以透過刪除事件,讓點擊效果失效:

複製程式碼 程式碼如下:


        $('#btn').unbind("click");這句程式碼的功能就是取消元素btn下的click事件。它不僅對於bind()方法有效,它對於click()方法同樣有效。從某個角度上講,bind("click",function(){})與click(function(){})是等價的。

也可以針對具體的方法,刪除特定的事件。下面的程式碼可以參考:

複製程式碼 程式碼如下:


unbind()方法的第二個參數是事件對應得執行函數的名字,這樣執行完後,只有myFun2這個事件被刪除了,其他兩個click事件正常執行。

還有一種跟bind()方法類似的方法one(),差別大概就是one()方法只執行一次。為每一個匹配元素的特定事件(像click)綁定一個一次性的事件處理函數。程式碼如下:

複製程式碼 程式碼如下:


點擊後,只執行一次。再次點選不會觸發效果。這就是one方法。

以上所述就是本文的全部內容了,希望本文能讓大家更好的理解jQuery的綁定事件和移除事件,

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn