在 jquery 插件中获取未定义错误的属性“retValue”

Question

我有以下我正在处理的 jquery 插件代码，但它给了我Uncaught TypeError: Cannot read property 'retValue' of undefined。下面是我的代码

(function ($) {
    var Plugin = {
        init: function (options, elem) {
            var self = this;
            self.elem = elem;
            self.$elem = $(elem);

            this.search = (typeof options === 'string') ? options:options.retValue;
            this.options = $.extend({}, $.fn.plugin.options, options);
        }
    };

    $.fn.plugin = function (options) {
        return this.each(function () {
            var plugin = Object.create(Plugin);
            plugin.init(options, this);
        });
    };

    $.fn.plugin.options = {
        retValue: 'value',
    };
})(jQuery);

$('#selector').plugin();

这里我没有在border() 中传递任何参数。所以我希望我的插件获得默认的retValue，但它给了我上面的错误。我该如何解决这个问题？

更新

我想通过以下三种方式使用这个插件。

$('#selector').plugin(); // does not work
$('#selector').plugin('string'); // works
$('#selector').plugin({key1: 'value1', key2: 'value2'}); // works

我怎样才能使第一个工作？

Answer 1

您可以对extend您的设置执行此操作：

var settings = $.extend({}, defaults, passedsettings);

如果没有通过，这将自动合并您的设置并用默认值填充它。

var Border = {
    init: function (options, elem) {
        var self = this;
        self.elem = elem;
        self.$elem = $(elem);
        self.options = $.extend({}, $.fn.border.options, options);
        alert( self.options.retValue );
    }
};

并使用以下选项调用插件：

$('#foo').border({ retValue : "abc" });

或者

$('#foo').border();