Как сделать вложенные параметры для плагинов в jQuery

Question

Я знаю, как делать плагины, но как мне использовать вложенные опции, такие как:

var defaults = {
    spacing:10,
    shorten_to:50,
    from_start:0,
    from_end:2,
    classes: {
        test:'testing'
    }
};

я знаю это не правильно, я просто не знаю, как написать правильный синтаксис, когда я хочу что-то сделать вроде это:

$('#breadcrumbs').breadcrumbs({classes{test:'new_example'},spacing:12})

приветствуются другие предложения, мне нужна возможность настраивать имена классов и их 7, поэтому вместо того, чтобы делать что-то вроде test_class, example_class и т. Д. Id, вроде бы, чище и аккуратнее, как в примере выше.

Answer 1

На самом деле это правильно. Ваша запись там называется JSON, и это очень простая запись (см. json.org )

var someobject = { prop: 'prop' };
var anotherobject = { name: 'name' };
someobject.someproperty = anotherobject;

эквивалентно

var someobject = { prop: 'prop', { name: 'name' }};

Во втором примере вам просто не хватает двоеточия.

$('#breadcrumbs').breadcrumbs({classes:{test:'new_example'},spacing:12})

Answer 2

Ваш плагин принимает один параметр параметров, и люди передают параметры в плагин, используя литерал объекта. Затем вы используете $ .extend, чтобы объединить параметры со значениями по умолчанию. Вот шаблон для плагина, который вы можете скопировать.

//Create closure
(function($) {

    var defaults = { //Default settings for breadcrumbs
        async: false,
        race: 100,
        interval: 1,
        classes: {
            test:'testing'
        }
    };

    //Plugin definition
    $.extend({

        //Execute the functions added to the stack
        breadcrumbs: function(options) {

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

            //Loop through each item in the matched set and apply event handlers
            return this.each(function(i) {

                //Code here , this = current selection
            });
        }
    });

// end of closure and execute
})(jQuery);

Вы бы назвали этот плагин так

$('div').breadcrumbs({async:true, interval:2, classes: {another: true}});