11 jQuery的事件繫結和解綁

2022-07-10 00:21:10 字數 1934 閱讀 5282

語法:

bind(type,data,fn)

描述:為每乙個匹配元素的特定事件(像click)繫結乙個事件處理器函式。

引數解釋:

(string) : 事件型別

(object) : (可選) 作為event.data屬性值傳遞給事件物件的額外資料物件

( function) : 繫結到每個匹配元素的事件上面的處理函式

示例:當每個p標籤被點選的時候,彈出其文字

$("p").bind("click", function());

你可以在事件處理之前傳遞一些附加的資料。

function handler(event) 

$("p").bind("click", , handler)

通過返回false來取消預設的行為並阻止事件起泡。

$("form").bind("submit", function() )

通過使用 preventdefault() 方法只取消預設的行為。

$("form").bind("submit", function(event));

語法:

unbind(type,fn);

描述:bind()的反向操作,從每乙個匹配的元素中刪除繫結的事件。

如果沒有引數,則刪除所有繫結的事件。

如果把在繫結時傳遞的處理函式作為第二個引數,則只有這個特定的事件處理函式會被刪除。

引數解釋:

(string) : (可選) 事件型別

fn(function) : (可選) 要從每個匹配元素的事件中反繫結的事件處理函式

示例:把所有段落的所有事件取消繫結

$("p").unbind()

將段落的click事件取消繫結

$("p").unbind( "click" )

刪除特定函式的繫結,將函式作為第二個引數傳入

var foo = function () ;

$("p").bind("click mouseenter", foo); // 給p段落繫結click mouseenter事件

$("p").unbind("click", foo); // 只解綁了p段落標籤的click事件

其實事件的繫結和解綁,都是我為了自定義事件做準備(大家把jquery的提供的事件熟記在心),以後對jquery熟了以後,可以玩一下自定義事件

語法:

trigger(type,data);

描述:在每乙個匹配的元素上觸發某類事件,它觸發的是由bind()註冊的自定義事件。

引數解釋:

(string) : 要觸發的事件型別

(array) : (可選)傳遞給事件處理函式的附加引數

示例:給乙個按鈕新增自定義的事件

$('button').bind('myclick',function(ev,a,b))

然後通過trigger()觸發自定義的事件

$('button').trigger('myclick',[1,2])

語法:

one(type,data,fn)

描述:為每乙個匹配元素的特定事件(像click)繫結乙個一次性的事件處理函式。在每個物件上,這個事件處理函式只會被執行一次。其他規則與bind()函式相同

引數解釋:

(string) : 事件型別

(object) : (可選) 作為event.data屬性值傳遞給事件物件的額外資料物件

(function) : 繫結到每個匹配元素的事件上面的處理函式

示例:當所有段落被第一次點選的時候,顯示所有其文字。

$("p").one("click", function());

jQuery 事件的繫結和解除繫結

html 老哥,點我 js document ready function 繫結方法,將做出反應的 封裝起來,提公升 的利用率,同時能減少記憶體的占用 on表示繫結事件,off表示解除事件,事件繫結不會覆蓋,如果乙個事件繫結了多個方法,解除預設全部解除,通過逗號隔開指定解除某個方法,老版本on和of...

jQuery的事件繫結和解綁

語法 bind type,data,fn 描述 為每乙個匹配元素的特定事件 像click 繫結乙個事件處理器函式。引數解釋 string 事件型別 object 可選 作為event.data屬性值傳遞給事件物件的額外資料物件 function 繫結到每個匹配元素的事件上面的處理函式 示例 當每個p...

事件的繫結和解綁 jQuery

之前學的滑鼠事件,表單事件與鍵盤事件都有個特點,就是直接給元素繫結乙個處理函式,所有這類事件都是屬於快捷處理。翻開原始碼其實可以看到,所有的快捷事件在底層的處理都是通過乙個 on 方法來實現的。jquery on 方法是官方推薦的繫結事件的乙個方法。基本用法 on events selector d...