jquery on 的用法

.on()方法事件處理程序到當(dāng)前選定的jQuery對象中的元素。

創(chuàng)新互聯(lián)長期為超過千家客戶提供的網(wǎng)站建設(shè)服務(wù)，團隊從業(yè)經(jīng)驗10年，關(guān)注不同地域、不同群體，并針對不同對象提供差異化的產(chǎn)品和服務(wù)；打造開放共贏平臺，與合作伙伴共同營造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為羅山企業(yè)提供專業(yè)的成都網(wǎng)站設(shè)計、成都做網(wǎng)站、外貿(mào)網(wǎng)站建設(shè)，羅山網(wǎng)站改版等技術(shù)服務(wù)。擁有10多年豐富建站經(jīng)驗和眾多成功案例,為您定制開發(fā)。

.on( events [, selector ] [, data ], handler(eventObject) )

events：類型: String

一個或多個空格分隔的事件類型和可選的命名空間，或僅僅是命名空間，比如"click", "keydown.myPlugin", 或者 ".myPlugin"。

selector：類型: String

一個選擇器字符串，用于過濾出被選中的元素中能觸發(fā)事件的后代元素。如果選擇器是 null 或者忽略了該選擇器，那么被選中的元素總是能觸發(fā)事件。

data：類型: Anything

當(dāng)一個事件被觸發(fā)時，要傳遞給事件處理函數(shù)的event.data。

handler(eventObject)：類型: Function()

事件被觸發(fā)時，執(zhí)行的函數(shù)。若該函數(shù)只是要執(zhí)行return false的話，那么該參數(shù)位置可以直接簡寫成 false。

jquery綁定事件on()方法

events:一個或多個用空格分隔的事件類型和可選的命名空間，如"click"或"keydown.myPlugin" 。

selector:一個選擇器字符串用于過濾器的觸發(fā)事件的選擇器元素的后代。如果選擇器為null或省略，當(dāng)它到達選定的元素，事件總是觸發(fā)。

data:當(dāng)一個事件被觸發(fā)時要傳遞event.data給事件處理函數(shù)。

fn:該事件被觸發(fā)時執(zhí)行的函數(shù)。 false 值也可以做一個函數(shù)的簡寫，返回false。

當(dāng)?shù)诙€參數(shù)'selector'為null時，on()和bind()其實在用法上基本上沒有任何區(qū)別了，所以我們可以認為on()只是比bind()多了一個可選的'selector'參數(shù)，所以on()可以非常方便的替換掉bind()

在 1.4之前相信大家非常喜歡使用live(),因為它可以把事件綁定到當(dāng)前以及以后添加的元素上面，當(dāng)然在1.4之后delegate()也可以做類似的事情了。live()的原理很簡單，它是通過document進行事件委派的，因此我們也可以使用on()通過將事件綁定到document來達到 live()一樣的效果。

1、live()寫法

2、on()寫法

這里的關(guān)鍵就是第二個參數(shù)'selector'在起作用了。它是一個過濾器的作用，只有被選中元素的后代元素才會觸發(fā)事件。

delegate() 是1.4引入的，目的是通過祖先元素來代理委派后代元素的事件綁定問題，某種程度上和live()優(yōu)點相似。只不過live()是通過document元素委派，而delegate則可以是任意的祖先節(jié)點。使用on()實現(xiàn)代理的寫法和delegate()基本一致。

1、delegate()的寫法

2、on()寫法

貌似第一個和第二個參數(shù)的順序顛倒了一下，別的基本一樣。

jQuery中delegate和on的用法與區(qū)別詳細解析

本篇文章主要是對jQuery中delegate和on的用法與區(qū)別進行了詳細的介紹，需要的朋友可以過來參考下，希望對大家有所幫助

在jQuery1.7中

.delegate()已被.on()取代。對于早期版本，它仍然使用事件委托的最有效手段。

在事件綁定和委派，delegate()和on在一般情況下，這兩種方法是等效的。

.delegate()

指定的元素(屬于被選元素的子元素)添加一個或多個事件處理程序，并規(guī)定當(dāng)這些事件發(fā)生時運行的函數(shù)。

代碼如下:

//

jQuery

1.4.3+

$(

elements

).delegate(

selector,

events,

data,

handler

);

//

jQuery

1.7+

$(

elements

).on(

events,

[selector],

data,

handler

);

例如：.delegate()

code:

代碼如下:

$("table").delegate("td","click",function(){

alert("hello");

});

.on()

code:

代碼如下:

$("table").on("click",

"td",

function()

{

alert("hi");

});

PS:

兩者區(qū)別是seleter和events順序不同

delegate和on方法被選元素的子元素必須是"合法的"子元素。比如

復(fù)制代碼

代碼如下:

$("table").delegate("button","click",function(){...});

$("table").on("click",

"p",

function(){...});

就不起作用，因為正常情況下，table子元素應(yīng)為tr,td...

on(events,[selector],[data],fn)，參數(shù)[selector]是可選，

一個選擇器字符串用于過濾器的觸發(fā)事件的選擇器元素的后代。

例如：

代碼如下:

$("table").on("click",

".td1",

function()

{

alert("hi");

});

過濾class為td1的table子元素

而delegate的selector是必需的。

本文題目：jqueryon原理,jquery概念
標(biāo)題鏈接：http://chinadenli.net/article26/dsgcpcg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供云服務(wù)器、虛擬主機、定制網(wǎng)站、品牌網(wǎng)站設(shè)計、網(wǎng)站內(nèi)鏈、定制開發(fā)

廣告

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