Question

我试图理解jQuery插件是如何工作的。这是我的第一个测试插件（它什么都不做:)）

(function($)
{
    var methods =
    {
        init : function(options)
        {
            if (options)  $.extend(settings, options);
            myElement = $(this);
            return myElement;
        },
        getInfo : function()
        {
            console.log('Info = ' + myElement.attr('id') + ' [' + settings.itemName + ']');
        }
    };

    var settings = {'itemName' : 'item' };
    var myElement = null;


    $.fn.myTest = function(method)
    {
        if (methods[method])
        {
            return methods[ method ].apply(this, Array.prototype.slice.call(arguments, 1));
        }
        else if (typeof method === 'object' || ! method)
        {
            return methods.init.apply(this, arguments);
        }
        else
        {
            $.error('Method ' + method + ' does not exist on jQuery.myTag');
        }
    };
})(jQuery);

在我的HTML页面中，我称之为：

$(document).ready(function()
{
    t = $('#list').myTest({itemName:'First'});
    t.myTest('getInfo');
    t2 = $('#l2').myTest({itemName:'Hello World'});

    t2.myTest('getInfo');
    t.myTest('getInfo');
});

我知道，该插件的变量'myElement'已更改：

Info = list [First] - OK
Info = l2 [Hello World] - OK
Info = l2 [Hello World] - Why???

我需要写的是，每个元素的插件变量'myElement'是不同的？感谢。

Answer 1

我解决了。感谢。

    data = $this.data('test');

    if (!data)
    {
        $(this).data('test',
        {
            element : $this,
            settings : settings
        });
    }

每个元素的自己的变量（jQuery插件）

1 个答案: