2009-04-13 7 views
0

Je travaille avec un plugin jquery qui ressemble à ceci:plugin jquery qui ne partage pas sa configuration entre les instances

(function($){ 
    var options; 
    $.fn.main(opts){ 
     options = opts; 
     //rest of code 
    } 
    $.fn.otherFunc(){ 
     //does something with options 
    } 
}(jQuery)); 

Le problème ici est que si j'utilise ce plugin 5 fois sur la page, les options La variable est écrasée et les 5 instances partagent toutes ces options. C'est mauvais, je veux que chaque instance de plugin ait sa propre config.

Existe-t-il une méthode jQuery non-hackish pour accomplir ceci?

modifier:

Je dois ajouter que je voudrais envisager des options d'addition à $ (ce) dans .fn.main de $ comme expando un peu hackish, parce que .fn.otherFunc $ pourrait ne pas être appelé le $ (this) de la fonction principale, donc je n'aurais pas accès à mes affaires!

Répondre

2

Si vous appliquez le même plug-in à plusieurs éléments comme celui-ci

$("#div1, #div2, #div3, #div4, #div5").main(opts); 

Vous devriez le diviser en 5 différents appels avec des options différentes - à savoir:

var opts1 = {...}; 
$("#div1").main(opts1); 

var opts2 = {...}; 
$("#div2").main(opts2); 

// etc. 

En outre, ajouter un paraemter à $.fn.otherFunc pour recevoir les objets d'options sur lesquels il devrait travailler.

EDIT: si vous n'êtes pas appeler otherFunc à l'intérieur main(), vous devriez demander pourquoi vous partagez des options entre eux. Dans ce cas, si vous postez quel est votre problème d'origine (c'est-à-dire le problème réel que vous essayez de résoudre), nous pourrions offrir une meilleure solution que deux options de partage de plugins différentes au lieu de les fusionner. Je recommande d'ajouter les données d'options à l'élément DOM se

(function($){ 
    var options; 
    $.fn.main = function(opts){ 
     options = opts; 
     //rest of code 
     alert(options.text); 
    } 
    $.fn.otherFunc = function(){ 
     //does something with options 
    } 
})(jQuery); 

$('a:first').main({text:'txt'}); 
$('a:last').main({text:'some other text'}); 

Dans votre code, pour garder la trace: