分類: 問(wèn)答 常識(shí)詞典 編輯 : 常識(shí) 發(fā)布 : 07-14

閱讀 :341

jQuery 為什么要?jiǎng)澐?bind()和.live()？直接用一個(gè)不行嗎？15 個(gè)答案

答案 1：

bind() 是直接綁定在元素上，而 live() 是通過(guò)冒泡的方式來(lái)綁定到元素上。舉兩個(gè)應(yīng)用場(chǎng)景來(lái)說(shuō)明他們的存在：第一、有一個(gè)按鈕，你想要用他來(lái)在點(diǎn)擊的時(shí)候通過(guò) AJAX 提交 form 的請(qǐng)求。因?yàn)檫@里只有一個(gè)按鈕，只綁定一次，你并不需要冒泡這種更費(fèi)力費(fèi)資源的方式來(lái)冒泡到 document 再指定這個(gè)元素。第二、在一個(gè)有 20個(gè)以上，甚至更多個(gè) li 的 ul 列表中，要讓每一個(gè) li 點(diǎn)擊的時(shí)候都去觸發(fā)相應(yīng)函數(shù)的時(shí)候。如果給每個(gè) li 都綁定一個(gè) click 事件，這樣是不是很蛋疼？這時(shí)通過(guò) live()（當(dāng)然更好是用 delegate() 這樣的方法，可以指定一個(gè)離 li 更近的父節(jié)點(diǎn)），其實(shí)只在 document 上綁定一次 click() 事件，你省了 19 次綁定。這是多省內(nèi)存的事。對(duì)吧？另外，有同學(xué)說(shuō)兩個(gè)會(huì)合起來(lái)，看完上面的解釋，你覺(jué)得呢？哈哈。場(chǎng)景不同，我們需要選擇不同的方式來(lái)解決問(wèn)題，他們提供出來(lái)就是為了方便這種不同場(chǎng)景的應(yīng)用，所以不應(yīng)該被合并，也不會(huì)被合并。

答案 2：

本身兩個(gè)提供的功能并不完全一樣，正如文檔中說(shuō)的，.bind()只能對(duì)已有的元素綁定事件，而.live()能對(duì)未來(lái)插入的元素綁定事件。從jQuery發(fā)展歷史來(lái)說(shuō)，.bind()是從1.0版開(kāi)始就已經(jīng)提供了的，這是對(duì)事件綁定提供一個(gè)統(tǒng)一的接口。而后在1.3版之后，才提供了.live()。為了給事件綁定提供更多靈活性。當(dāng)然，確實(shí)有可能在未來(lái)某個(gè)版本中合并成一個(gè)，通過(guò)給bind增加一個(gè)參數(shù)，-調(diào)用live，來(lái)完成live的功能。但目前從1.4.3里新增的那個(gè)參數(shù)來(lái)看，似乎近期內(nèi)不太可能了……

答案 3：

Best answer is -ere:alfajango/blog... , don"t trust city legend.

答案 4：

不一樣，live()可以實(shí)現(xiàn)動(dòng)態(tài)綁定。例如：$elem.bind("click",fn)時(shí)候，所有的$elem點(diǎn)擊都會(huì)觸發(fā)fn，但是當(dāng)我新插入一個(gè)節(jié)點(diǎn)$elem時(shí)，新節(jié)點(diǎn)并沒(méi)有綁定click事件。live()就具備這樣的功能。

答案 5：

性能神馬的都是浮云 (因?yàn)?jQuery 優(yōu)化得很不錯(cuò)), 重點(diǎn)是 1.4.4 前的 live() 的不支持 stopPropagation()jsfiddle.net/J4eUb/2/至于用哪一個(gè)是根據(jù)應(yīng)用場(chǎng)景來(lái)區(qū)分的, 沒(méi)有通用的規(guī)則

答案 6：

live() 是委托，事實(shí)上是綁定在父元素上，而bind()就是綁定在指定元素上

答案 7：

可以看看live/delegate的原理。blogjava.net/Hafeyang...

答案 8：

1、bind是綁定已有元素，不支持動(dòng)態(tài)綁定。live可以動(dòng)態(tài)綁定事件2、1.4.4之前的live不支持stopPropagation()，bind支持。@C-ris3、其實(shí)有些時(shí)候可以用clone(true)實(shí)現(xiàn)動(dòng)態(tài)的綁定，當(dāng)然這只適合元素結(jié)構(gòu)大致相同的情況。

答案 9：

live()是jQuery 1.3中新增的方法。給所有當(dāng)前以及 將來(lái) 會(huì)匹配的元素綁定一個(gè)事件處理函數(shù)（比如click事件）。也能綁定自定義事件。重點(diǎn)突出 “將來(lái)”。live()函數(shù)給所有當(dāng)前以及將來(lái)（將來(lái)：可理解為用過(guò)ajax,js等插入的元素）會(huì)匹配的元素綁定一個(gè)事件處理函數(shù)。與bind()不同的是，live()一次只能綁定一個(gè)事件。

答案 10：

粗淺的認(rèn)為：給a元素bind()一個(gè)事件b后，dom又動(dòng)態(tài)添加了一個(gè)a元素，這時(shí)候bind()到前一個(gè)a元素上的事件就出發(fā)不了。需要用到live()

答案 11：

前面人已經(jīng)說(shuō)過(guò)了 live() 和 bind() 的區(qū)別了，我補(bǔ)充下，還有個(gè) delegate() 的，小范圍的使用事件代理，用這個(gè)性能會(huì)比 live()　更好的

答案 12：

一定要注意，如果重復(fù)綁定的話，很可能會(huì)執(zhí)行多次效果。比如說(shuō)每添加一個(gè) 都live一下，那么之前的 點(diǎn)擊一下會(huì)執(zhí)行好幾次--------------------------------------補(bǔ)充 2011-8-22-----------------------------------------------------可能之前沒(méi)有說(shuō)清楚。有的時(shí)候一段代-重復(fù)加載，比如$(document).ready(function(){ $("#somet-ing").live("click",function(){ alert(); });});這樣一段代碼有的時(shí)候需要重復(fù)的加載，比如google -p api調(diào)用的時(shí)候，比如做分布式web app的時(shí)候，代碼互相獨(dú)立，一旦這條語(yǔ)句重復(fù)出現(xiàn)，那么，當(dāng)你點(diǎn)擊somet-ing的時(shí)候便會(huì)alert()兩次或多次。這是由jquery中l(wèi)ive方式?jīng)Q定的，其會(huì)將這種數(shù)據(jù)結(jié)構(gòu)以冒泡的方式壓入內(nèi)存，每當(dāng)新建一個(gè)dom他都會(huì)自動(dòng)檢測(cè)，耗費(fèi)資源、非常可能產(chǎn)生內(nèi)存泄露！因?yàn)槿绻阒型緍emove掉了這個(gè)dom元素，按照jquery的源碼來(lái)看他是沒(méi)有先-之后解除live再刪除dom的，所以要小心。我的意思是，在使用jquery中，如果頁(yè)面是傳統(tǒng)的，當(dāng)然遇不到這種現(xiàn)象，這也就是為什么很多人很奇怪我的看法，因?yàn)榇a都是單單出現(xiàn)一次被瀏覽器讀取。但是如果是動(dòng)態(tài)代碼的情況，我個(gè)人推薦使用bind，雖然費(fèi)事，但是可靠。

答案 13：

live() 能取代 bind()么？

答案 14：

不會(huì),兩者功能不是一樣的，live使用了冒泡方式來(lái)判斷當(dāng)前觸發(fā)事件的對(duì)象，用的場(chǎng)景會(huì)少很多，相比bind有性能問(wèn)題！

答案 15：

live() 是針對(duì)執(zhí)行時(shí)尚未加入dom tree的元素而設(shè)，是bind() 的拓展

下一篇:你喜歡知乎？ 下一篇 【方向鍵 ( → )下一篇】

上一篇:如何讓新浪徹底刪除自建微博賬號(hào)？ 上一篇 【方向鍵 ( ← )上一篇】