comment étendre les options d'un plugin jquery avec un tableau

Je suis en train d'écrire un plugin jQuery. Il y a quelques options par défaut et je peux les changer sur le code HTML, mais comment puis-je modifier une option si elle se compose d'un tableau?

Voici le code dans le plugin:

(function($){    
    $.fn.extend({  
        aniTag: function(options) {     
            var defaults = {
                radius: 25,
                defaultradius: 0,
                enableTilt: true,
                tilt : 20,
                random : true, 
                randomMax : 25 ,
            };

            var colors = new Array('4AC7ED', 'FDC015', '9F78EC', 'F25C33');         

            var options = $.extend(defaults, options); 

            return this.each(function() {                
                var o = options;
                //some stuff
            });
        }
    });  
})(jQuery);

Voici le code html d'utilisation:

<script type="text/javascript">
    $(document).ready(function() {
        $('.tags').aniTag({enableTilt: false});
    });
</script>

Comme vous pouvez le voir je peux changer enableTilt option. Ce que j'ai à faire est de modifier les valeurs dans le color tableau. Oui, je sais que j'ai besoin de mettre ce tableau dans defaults var, mais je ne sais pas comment le faire.

InformationsquelleAutor dum | 2011-11-21
  1. 15

    Ajouter à votre tableau de couleurs à vos paramètres par défaut comme

    var defaults = {
    radius: 25,
    defaultradius: 0,
    enableTilt: true,
    tilt : 20,
    random : true, 
    randomMax : 25 ,
    colors: ['4AC7ED', 'FDC015', '9F78EC', 'F25C33']
};

    Ensuite, vous pouvez les écraser avec

    $('.tags').aniTag({enableTilt: false, colors: ['ffffff', '000000']});

    Violon Démo: http://jsfiddle.net/Beufe/1/

    var defaults = {
    radius: 25,
    defaultradius: 0,
    enableTilt: true,
    tilt: 20,
    random: true,
    randomMax: 25,
    colors: ['4AC7ED', 'FDC015', '9F78EC', 'F25C33']
};

alert(defaults.colors.length);  //output: 4
alert('Default Value colors[0] = ' + defaults.colors[0]);  //output: 4AC7ED

var options = $.extend(defaults, {
    enableTilt: false,
    colors: ['ffffff', '000000']
});

alert(options.colors.length);  //Output: 2
alert('New Value colors[0] = ' + options.colors[0]);  //output: ffffff
    • j'ai ajouté le tableau de votre chemin. mais il ne reçoit pas toutes les valeurs de la matrice. même pas ceux par défaut
    • les valeurs par défaut.couleurs[0] produit un résultat de 4AC7ED, modifié par l'adoption d'un nouveau tableau et à l'aide de .extend() l'ensemble des produits d'une valeur de ffffff. Violon démo ici jsfiddle.net/Beufe
    • merci beaucoup pour les infos supplémentaires sur jsfiddle. c'était la première fois que j'ai utilisé ça 🙂
    InformationsquelleAutor Jeff Wilbert
  2. 1

    J'aurais pensé que vous pourriez faire -

    var newcolors = new Array('FFFFFF', '00FFFF', '9F78EC', 'F25C33');

    puis il suffit de passer votre tableau dans votre plug-in via les options de la carte -

    $('.tags').aniTag({enableTilt: false,colorArray:newcolors});

    Si vous définissez le tableau dans vos options initiales ainsi ,

    var defaults = { radius: 25, defaultradius: 0, enableTilt: true, tilt : 20, random : true, randomMax : 25 , colorArray:colors };

    Puis l'étendre fonction doit simplement remplacer la table initiale avec la nouvelle qui a été adoptée dans le.

    • Faites-vous référence à options.colorArray dans votre plug-in lorsque vous utilisez le tableau? Les docs pour extend suggèrent qu'il devrait fonctionner pour les tableaux - api.jquery.com/jQuery.extend
    InformationsquelleAutor ipr101
  3. 0

    je pense que vous voulez dire que vous souhaitez pour obtenir les paramètres de l'attribut html?

    <a data-param1="test" data-param2="test">test</a>

    alors vous pourriez le faire 

    $('a').data('param1') and $('a').data('param2')

    pour les obtenir.

    InformationsquelleAutor DoXicK