jQuery基礎系列（三）---事件介紹(3)---事件處理方法

什么是事件處理方法？其實就是把多個事件綁定在一個元素中，你也可以理解為事件集，閑話不多說，下面亮代碼

成都創(chuàng)新互聯公司客戶idc服務中心，提供西部信息服務器租用、成都服務器、成都主機托管、成都雙線服務器等業(yè)務的一站式服務。通過各地的服務中心，我們向成都用戶提供優(yōu)質廉價的產品以及開放、透明、穩(wěn)定、高性價比的服務，資深網絡工程師在機房提供7*24小時標準級技術保障。

/*===================================Jquery時間處理方法======================================================*/

1.bind(),unbind();

作用：

bind()函數為被選擇元素添加一個或者多個事件

unbind()函數為被選元素移除一個或多個事件

語法：

$(selector).bind(event,data,function) 說明：event方法名稱，data可選額外傳入參數,function處理方法

$(selector).unbind(event,function) 說明：event方法名稱，function 規(guī)定從元素指定事件取消綁定的函數名

示例：

$("button").bind(click,mouscover,function(){
 $("p").slideToggle();

 $(this).unbind(mouseover);

});

當按鈕移入或點擊時，P元素隱藏顯示，同時移除鼠標移入事件

2.live(),die()

作用：

live()函數為被選擇元素添加一個或者多個事件

die()函數為被選元素移除一個或多個事件

語法：

$(selector).live(event,data,function) 說明：event方法名稱，data可選額外傳入參數,function處理方法

$(selector).die(event,function) 說明：event方法名稱，function 規(guī)定從元素指定事件取消綁定的函數名

示例：

$("button").live(click,mouscover,function(){
 $("p").slideToggle();

});

$("p").die();

當按鈕移入或點擊時，P元素隱藏顯示，同時移除鼠標移入事件

移除所有通過 live() 方法向 p 元素添加的事件處理程序;

3.delegate(),undelegate()

作用：

delegate() 方法為指定的元素（屬于被選元素的子元素）添加一個或多個事件處理程序，并規(guī)定當這些事件發(fā)生時運行的函數。
使用 delegate() 方法的事件處理程序適用于當前或未來的元素（比如由腳本創(chuàng)建的新元素）

undelegate() 方法刪除由 delegate() 方法添加的一個或多個事件處理程序。

語法：

$(selector).delegate(childSelector,event,data,function)

參數說明：childSelector必需。規(guī)定要附加事件處理程序的一個或多個子元素。event必需。規(guī)定附加到元素的一個或多個事件。由空格分隔多個事件值。必須是有效的事件。data可選。規(guī)定傳遞到函數的額外數據。function必需。規(guī)定當事件發(fā)生時運行的函數。

$(selector).undelegate(selector,event,function)

selector可選。規(guī)定需要刪除事件處理程序的選擇器。event可選。規(guī)定需要刪除處理函數的一個或多個事件類型。function可選。規(guī)定要刪除的具體事件處理函數。

示例：

$(document).ready(function(){
 $("body").delegate("p","click",function(){
   $(this).slideToggle();
 });
 $("button").click(function(){
   $("body").undelegate();
 });
});

點擊任何P元素都會消失，點擊按鈕取消消失效果

4.trigger(）

作用：trigger() 方法觸發(fā)被選元素的指定事件類型

語法：

$(selector).trigger(eventObj)

示例：

$(document).ready(function(){
 $("input").select(function(){
   $("input").after("文本被選中！");
 });
 $("button").click(function(){
   $("input").trigger("select");
 });
});

5.toggle()

作用：

toggle() 方法用于綁定兩個或多個事件處理器函數，以響應被選元素的輪流的 click 事件。
該方法也可用于切換被選元素的 hide() 與 show() 方法。

語法：

$(selector).toggle(function1(),function2(),functionN(),...) 參數說明：function1()必需。規(guī)定當元素在每偶數次被點擊時要運行的函數。function2() 必需。規(guī)定當元素在每奇數次被點擊時要運行的函數。functionN(),... 可選。規(guī)定需要切換的其他函數。

示例：

$("p").toggle(
 function(){
 $("body").css("background-color","green");},
 function(){
 $("body").css("background-color","red");},
 function(){
 $("body").css("background-color","yellow");}
);

本文名稱：jQuery基礎系列（三）---事件介紹(3)---事件處理方法
文章鏈接：http://bm7419.com/article46/ipodhg.html

成都網站建設公司_創(chuàng)新互聯，為您提供小程序開發(fā)、網站建設、虛擬主機、企業(yè)建站、網站設計、定制開發(fā)

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯