如何編寫本地使用的jQuery可鏈接函數？

如何編寫可鏈接的函數但不污染$ .fn？編寫函數僅用於在我的插件中使用。可能嗎？如何編寫本地使用的jQuery可鏈接函數？

$('.myclass').makeSomething().andOneMoreFunction().andLast();

這是正確的做法嗎？

UPD。在我的情況下，最好的解決方法是擴展方法：

String.prototype.getMyLength = function(){return this.length;}

現在，我可以把這個函數來任何像這樣的字符串：

var mystring = "test"; 
mystring.getMyLength();

或者

"teststring".getMyLength()

，並使其可鏈接：

String.prototype.getMe = function(){return this;} 
"string".getMe().getMe().getMe().getMe().getMe();

感謝您的回答！

來源

2013-02-22 Roman Bats

你可以鏈接所有你想要的。如果您自己定義一個$.fn，則在您的末尾運行return this非常重要。

如果你想自己寫一些JavaScript，你也可以鏈！這隻取決於你的回報。所以，如果你返回一些其他對象，你可以從該對象鏈接。返回值用於此。

例

var obj = { 
    test : function(){ 
     alert("Y"); 
     return this; 
    }, 
    test2 : function(){ 
     alert("2"); 
     return this; 
    } 
} 
obj.test().test2(); // And so on since it returns this

jQuery插件API

$.fn.test = function(){ 
    var methods = { 
     method0 : function(){ 
      alert("method0"); 
      return this; 
     } 
    }; 
    return methods; 
} 
var api = $("obj").test(); // Returns methods 
api.method0(); // Calling a function from the returned methods. 
// OR 
$("obj").test().method0();

以上功能不jQuery的環連接的了。所以你不能使用$("obj").test().addClass("test")，因爲你返回你自己的API！

來源

2013-02-22 16:58:35 Niels

但問題是'如何做到這一點而不污染'$ .fn''。如果你只想在你的插件的內部使用這些函數，並且想避免名稱衝突，我認爲這是非常合理的。 – 11684 2013-02-22 17:02:35

考慮[''console.log''alert']（http://stackoverflow.com/q/8203473/1615483） – 2013-02-22 17:06:01

我的示例2是否回答此問題？我已經給出了2個使用鏈接的例子。第二個返回一個API。所以在內部也可以這樣使用。只取決於你的回報價值。 @PaulS。這只是僞代碼。 – Niels 2013-02-22 17:07:01

當您撥打a.foo()時，函數foo被調用，this設置爲a。你可以使用這個你的優勢。

還記得表達式a.foo()從函數內的任何return d開始計算。

所以，只是返回this。

然後a.foo()評估回a，並且(a.foo()).bar()變得等效於調用a.foo()然後調用a.bar() ...上a即鏈接操作！

$.fn不是特別神奇的—它只是使用上述邏輯與您即將使用的相同方式。

來源

2013-02-22 17:00:52

您可以通過使用插件函數的第一個參數來指定選擇的方法來避免污染;例如

(function() { 
    var o = { // object holding your methods 
     'bar': function() {console.log('bar', this); return this;}, 
     'foobar': function() {console.log('foobar', this); return this;} 
    }; 
    $.fn.foo = function (method /*, args*/) { 
     return o[method].apply(
      this, 
      Array.prototype.slice.call(arguments, 1) // pass your args 
     ); 
    }; 
}());

然後

$('something').foo('bar').foo('foobar'); 
/* 
bar, thisobj 
foobar, thisobj 
*/

這使得你可以訪問jQuery對象爲正常，太。

來源

2013-02-22 17:16:15

如何編寫本地使用的jQuery可鏈接函數？

回答

相關問題