[jQuery] dynamic plugin loading
That was my first attempt, but, as Felix suggested, you don't know when the script has ended loading since it's an async load. The callback solution did the trick. Here you have the final code. It loads .js and .css in one call, and seems to work in FF and IE. You can specify base directories for .js and .css files with 'jsbase' and 'cssbase' options respectively, and switch css loading with the 'css' option. Finally you can specify the callback function with the 'onload' option.
An example of use:
$(document).ready(function(){
$.require('jquery.accordion', {jsbase: 'js',
onload: function(){
$('#theaccordion').Accordion();
}
});
$.require('jquery.history', {jsbase: 'js'});
...
It assumes the same name for plugin.js and plugin.css
//Plugin loading in jquery
(function(jq){
jq.extend({
require: function(plugin, o){
o = jq.extend({
css: false,
jsbase: '',
cssbase: '',
onload: null
}, o || {});
var src = o.jsbase + '/' + plugin + '.js';
// Provide a callback function to the getScript function
jq.getScript(src, o.onload);
if(o.css){
var c = document.createElement('link');
c.type = 'text/css';
c.rel = 'stylesheet';
c.href = o.cssbase + '/' + plugin + '.css';
jq('head')[0].appendChild(c);
}
}
});
})(jQuery);
Thanks to all.
Jip
-----Mensaje original-----
De: discuss-bounces@jquery.com [mailto:discuss-bounces@jquery.com] En nombre de Michael Geary
Enviado el: jueves, 28 de diciembre de 2006 17:58
Para: 'jQuery Discussion.'
Asunto: Re: [jQuery] dynamic plugin loading
If you're just trying to load a stylesheet dynamically, all you need to do
is this:
function addSheet( url, doc ) {
doc = doc || document;
var link = doc.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = url;
doc.getElementsByTagName('head')[0].appendChild( link );
}
Similarly, you can load a script with:
function addScript( url, doc ) {
doc = doc || document;
var script = doc.createElement( 'script' );
script.type = 'text/javascript';
script.charset = 'utf-8';
script.src = url;
doc.getElementsByTagName('head')[0].appendChild( script );
}
-Mike