在使用默认选项制作jquery插件时遇到问题

时间:2013-12-29 18:44:18

标签: javascript jquery jquery-plugins

我有以下代码。

(function ($) {
    var Obj = {
        init: function (options, elem) {
            this.elem = elem;
            this.$elem = $(elem);
            this.url = 'http://example.com/api/public/v1.0/page.json';

            if (typeof options === 'string') {
                this.search = options;
            } else {
                this.search = options.search;
                this.options = $.extend({}, $.fn.jPlugin.options, options);
                console.log(self.options);
            }
        }
    };

    $.fn.jPlugin = function (options) {
        console.log(options);
        return this.each(function () {
            var obj = Object.create(Obj);
            obj.init(options, this);
        });
    };

    $.fn.jPlugin.options = {
        search: 'happy'
    };
})(jQuery);

当我调用上面的插件$('.element').jPlugin({ search: smile }),即使用选项时,它会记录smile但是当我在没有选项$('.element').jPlugin()的情况下调用它时,它就不会获得默认选项。为什么以及我在这段代码中做错了什么?

1 个答案:

答案 0 :(得分:0)

您需要扩展默认选项,然后传入新对象:

$.fn.jPlugin = function(options) {
  options = $.exend({}, $.fn.jPlugin.options, options || {});
  console.log(options)
}

extend static方法会将默认值复制到新的空白对象,然后使用传入的选项中的属性覆盖或添加新对象的任何属性。如果没有传递任何内容,它将尝试将一个空对象应用于新的选项对象,该对象将不会执行任何操作。

修改

我回答得太快,你实际上有一些错误的东西看到这个小提琴:http://jsfiddle.net/7FrB3/找到合适的答案。

基本上你需要确保你没有传递未定义的选项。所以我确保选项永远是配置对象或空白对象。您还记录了未定义的“self.options”。我认为你的意思是'this.options'