1

我一直在试图弄清楚为什么我的自定义 jQuery 插件对象似乎不存在我的公共方法。

我创建了一个简化版本的 jQuery 插件，其中包含一个私有变量和两个公共方法来访问/修改私有变量。我在网上看过，但结果不是很清楚，或者我的搜索技巧很糟糕。

它一直在说“ TypeError: myObject.getMyValue is not a function ”，有人知道我做错了什么，或者有更好的解决方法的建议吗？

下面是基本对象类，但可以在 jsFiddle 链接上找到正确的代码示例。

(function ($) {

    var MyClass = function (element) {

        var myValue = 'Hello World';

        this.getMyValue = function() {
            return myValue;
        };

        this.setMyValue = function(value) {
            myValue = value;
        };

        return this;
    };

    $.fn.myPlugin = function() {
        return this.each(function(key, value){
            if ($(this).data('myclass')) {
                return $(this).data('myclass');
            }

            var instance = new MyClass(this);
            $(this).data('myclass', instance);
            return instance;
        });
    };

})(jQuery);

var myObject = $('#test').myPlugin();

alert(myObject.getMyValue());
myObject.setMyValue('Goodbye World');
alert(myObject.getMyValue());

http://jsfiddle.net/hZExb/4/

4

1 回答 1

1

因为您要返回的结果this.each()是this. 在外部创建一个变量this.each()并在完成后返回它this.each。

jsFiddle

$.fn.myPlugin = function() {
    var instance;
    this.each(function(key, value){
        if ($(this).data('myclass')) {
            return $(this).data('myclass');
        }

        instance = new MyClass(this);
        $(this).data('myclass', instance);
    });
    return instance;
};

如果你想返回一个 MyClass 的数组，如果你的 jQuery 对象是一个集合，你可以这样做：

jsFiddle

$.fn.myPlugin = function() {
    var instances = [];
    this.each(function(key, value){
        if ($(this).data('myclass')) {
            return $(this).data('myclass');
        }

        var instance = new MyClass(this);
        $(this).data('myclass', instance);
        instances.push(instance);
    });
    if (instances.length == 1)
        return instances[0];
    return instances;
};
于 2013-03-31T16:10:21.487 回答