附加多個jQuery插件到一個單一的元素

據互聯網jQuery插件開發指南，開發一個jQuery插件的共同做法是：附加多個jQuery插件到一個單一的元素

(function($) { 
    $.fn.myplugin = function(options){ 
     //... 
     //Plugin common characteristic 
     //e.g. default settings 
     //... 

     //Attach to each desired DOM element 
     return this.each(function(){  
      //Instantiation stuff... 
     }); 
    } 

})(jQuery); 

$(document).ready(function(){ 
    $(".someclass").myplugin(); 
})

在我看來，如果與元素類「someclass」已被附加到另一個插件，一旦這些元素將附加到「myplugin」，它們將失去與先前附加的插件的原始關係。我不確定我的想法是否完全正確。請告知是否有誤解。

謝謝！ William Choi

來源

2011-02-23 William Choi

'this.each（）'不附加任何東西。它遍歷所選的所有元素並對它們執行一些操作。 – 2011-02-23 10:25:58

元素沒有「附加」到插件。一個插件只是在jQuery包裝器中爲匹配的元素集添加更多的方法。所以就像jQuery包裝器有parent和find一樣，它也有插件的myplugin方法。只要沒有命名衝突，這些都可以共存。

確實，如果兩個不同的插件都試圖改變一些不能同時成爲兩件事的元素（一個插件將前景色改爲「藍色」，另一個插件則將前景色改爲「紅色「），那麼他們會碰撞如果你在同一個元素集上調用了兩個插件方法。但這就像兩個電話css。

特別是，請記住，可以有多個事件處理程序分配給同一元素上的同一個事件，所以掛鉤事件不一定會相互衝突（除非其中一個事件在處理期間停止事件）。

這裏的兩個插件上的匹配元素的集合作用的例子，但在非衝突的方式：

plugin1.js：

(function($) { 
    $.fn.foo = function() { 
     this.css("background-color", "#b00"); 
     return this; 
    }; 
})(jQuery);

plugin2.js：

(function($) { 
    $.fn.bar = function() { 
     this.css("color", "white"); 
     return this; 
    }; 
})(jQuery);

用法：

$("#target").foo(); 
$("#target").bar();

甚至

$("#target").foo().bar();

Live example

現在，如果這兩個foo和bar插件試圖設置前景色，一個後來被稱爲會贏。

這裏的一對插件既要處理的click事件，而是以一種合作的方式做到這一點的例子：

plugin1.js：

(function($) { 
    $.fn.foo = function() { 
     this.click(function() { 
      $("<p>Click received by foo</p>").appendTo(document.body); 
     }); 
     return this; 
    }; 
})(jQuery);

plugin2 。JS：

(function($) { 
    $.fn.bar = function() { 
     this.click(function() { 
      $("<p>Click received by bar</p>").appendTo(document.body); 
     }); 
     return this; 
    }; 
})(jQuery);

用法：

jQuery(function($) { 

    $("#target").foo().bar(); 

});

Live example

來源

2011-02-23 10:26:38

有沒有神奇的關係怎麼回事。沒有中央註冊表或管理單元「屬於」任何一個元素或任何一個插件。

Javascript對象只是被破解的函數;當你將一個插件附加到一個元素上時，你只需要調用一些第三方庫函數來處理該元素，並且可能會在整個會話期間存儲一些內部數據以協助其動畫。

因此，沒有任何法律上阻止您將多個插件「附加」到相同的元素，當然它們是否在邏輯上兼容還是另一個問題。

來源

2011-02-23 10:34:25

附加多個jQuery插件到一個單一的元素

回答

相關問題