开发者

How do I make nested options for plugins in jQuery

开发者 https://www.devze.com 2022-12-26 08:24 出处:网络
I know how to do plugins, but how do I do nested options like: var defaults = { spacing:10, shorten_to:50,

I know how to do plugins, but how do I do nested options like:

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

i know that isn't right, i just dont know how to write the proper s开发者_C百科yntax when I want to do something like this:

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

other suggestions are welcome, im in need of the ability to custom class names and there are 7, so rather than making something like test_class, example_class, etc id like it cleaner and neater like the example above.


Your plugin takes one options parameter and people pass parameters into the plugin using an object literal. You then use $.extend to combine the options with the defaults. Here is a pattern for a plug-in you can copy.

//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);

You would call this plug-in like so

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


Actually that is correct. Your notation there is known as JSON, and it's an extremely simple notation (see json.org)

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

Is equivalent to

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

In your second example, you're just missing a colon.

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

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号