2011-09-08 58 views
9

我正在看一個jQuery插件,它有一個單一的功能。建立適當的默認值,雖然構造函數的參數函數定義了兩個輔助函數,然後作爲最後一部分返回調用this.each(),像這樣經過:「return this.each()」在jQuery中做了什麼?

return this.each(function() { 
//long method defined here 
}); 

我明白使用this.each()修改匹配的DOM元素等,但是return語句完成了什麼?某種修改的DOM元素的數組,然後可以在其他調用中鏈接?

我已閱讀關於this.each在這個網站,但我不能完全確定什麼return在這裏做。感謝您幫助解決這個問題。

回答

7

它允許一個叫上一堆元素的插件或事件,然後應用相同的功能或事件他們的所有

所以,如果你這樣做:

$('.selector').myPlugin(); 

如果讓我們說,.selector包含10個元素,所有10個元素將得到myPlugin所做的任何事情。


退貨的原因是.each說法是因爲不論它被賦予.each()回報,它可以讓你把多個功能和插件在一起的一個jQuery的元素。

例如:

$('.selector').myPlugin().yourPlugin(); 
+0

感謝大家的答覆。我想讓我感到困惑的是在同一行上有'return'和this.each()。作爲一個等價物,我可以調用this.each(...),然後在該函數調用結束時,在下一行寫入'return this'? – larryq

+0

鍵入上面的內容後,我想我現在看看發生了什麼。我必須將this.each(..)的結果保存到一個變量中,該變量將成爲jQuery對象,並在方法結束時返回該變量。 this.each(...)上下文中的'this'引用我稱之爲函數的DOM元素。 – larryq

10

.each返回它被調用的元素,所以在這種情況下,可能會保持方法在該選擇器上鍊接的能力。這意味着,如果該插件的方法被稱爲foo,你應該能夠做到

$("mySelector").foo().show(); 

由於foo返回的.each的結果基本上是$("mySelector").

希望這是有道理的。

4

這使其能夠保持對象鏈,所以你可以調用jQuery方法是這樣的:

$("selector").css().mouseover().etc().blahblah(); 
2

它返回該方法如在docs表示被稱爲上jQuery對象。所以你可以調用返回值的另一種方法。

// without method chaining 
myobject.a() 
myobject.b() 
myobject.c() 

// with method chaining 
myobject.a().b().c(); 

method chainingfluent interface