javascript - 如何在 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

您的插件采用一个选项参数，人们使用对象字面量将参数传递到插件中。然后使用 $.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}});