建站
咨詢
售后
建站咨詢
新聞中心
近來在研究JS的時候，小碼哥又一次看到j(luò)query中常見的幾種綁定事件的方法：bind()，live(),delegate()。因此，閑來無事，想把他們幾個做一下系統(tǒng)的分析，一遍后面的碼農(nóng)們能夠一起分享！
創(chuàng)新互聯(lián)專業(yè)為企業(yè)提供鄢陵網(wǎng)站建設(shè)、鄢陵做網(wǎng)站、鄢陵網(wǎng)站設(shè)計、鄢陵網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計與制作、鄢陵企業(yè)網(wǎng)站模板建站服務(wù)，十余年鄢陵做網(wǎng)站經(jīng)驗，不只是建網(wǎng)站，更提供有價值的思路和整體網(wǎng)絡(luò)服務(wù)。
先說好，鄙人也算是JS的初學(xué)者，很復(fù)雜的模塊啥的，也是略懂而已，要是有碼神看到，可別Ma我哈！！
那好，下面就直接進入主題了~
首先，分別介紹一下這三個方法：
1、bind()——$(selector).bind(event,data,function);
event 為必需，規(guī)定添加到元素上的一個或多個事件，由空格分隔多個事件，必需是有效事件
data 可選，規(guī)定傳遞到函數(shù)的額外數(shù)據(jù)，一般用不到
function 必需，規(guī)定當事件發(fā)生時運行的函數(shù)。
實例：
$("button").bind("click",function(){
$("p"),slideToggle();//slideToggle()方法是鼠標點擊切換
})
還可以對同一個元素添加多個事件：$(selector).bind(event:function,event:function,....);
$(document).ready(function(){
$("button").bind(click:function(){
$("p").slideToggle();
},
mouseover:function(){
$("body").css({'background','red';})
},
mouseout:function(){
$("body").css('background','#fff');
});
});
2、live()——$(selector).live(event,data,function);
event 為必需，規(guī)定添加到元素上的一個或多個事件，由空格分隔多個事件，必需是有效事件
data 可選，規(guī)定傳遞到函數(shù)的額外數(shù)據(jù)，一般用不到
function 必需，規(guī)定當事件發(fā)生時運行的函數(shù)。
實例：
$("button").live("click",function(){
$("p").slideToggle();
})
live()方法有一個好處就是可以為HTML還不存在（即由JS腳本臨時創(chuàng)建的新元素上添加事件）
3、delegate()——$(selector).delegate(childSelector,event,data,function);
childSelector 必需，規(guī)定要附加事件處理程序的一個或多個子元素。
event 必需，規(guī)定附加到元素上的一個或多個事件。
由空格分隔多個事件值，必需是有效事件。
data 可選，規(guī)定傳遞到函數(shù)的額外數(shù)據(jù)。
function 必需，規(guī)定當事件發(fā)生時運行的函數(shù)。
delegate()方法同樣可以為HTML還不存在（即由JS腳本臨時創(chuàng)建的新元素上添加事件）。
實例：
$('div').delegate('button','click',function(){
$("p").slideToggle();
})
下面就來分析一下他們的異同：
首先，單看簡單的針對某個元素進行事件綁定，他們之間貌似沒有多少區(qū)別，都可以實現(xiàn)簡單的事件綁定，且他們都是遵循事件冒泡（事件傳播）方式查詢要綁定事件的元素。
但bind()方法，卻不能像live()和delegate()方法那樣，為未來（即由JS腳本新生成和創(chuàng)建的元素）添加事件綁定。bind()方法只能對HTML中已經(jīng)存在的元素添加綁定事件。
live()方法有一個最大的缺點，就是它僅能針對直接的CSS選擇器做操作，這使得它變得非常不靈活。
在live()和delegate()之間，唯一的差別就在于它們在對要綁定事件的元素的獲取速度上有差異。在事件傳播上，后者要比前者的速度更快一點，只因后者的限制條件更精準一些。這可以從它們的綁定事件的結(jié)構(gòu)來看出來。
鑒于以上分析，我們更傾向于live()和delegate()方法。而這兩者，有傾向與后者。
但，對于停止事件傳播來說，bind()方法會高效而直接。因此，我們平時用來阻止事件傳播時，會選擇bind()方法：
$('a').bind('click',function(e){
e.preventDefault();
e.stopPropagation();
});
只因其他兩種方法由于事件冒泡而耽誤了時間。
名稱欄目：關(guān)于jquery中的bind()、live()、delegate()的區(qū)別分析淺析
URL分享：http://www.dlmjj.cn/article/ppcscs.html
