Question

我需要编写一个可以类似于此方式使用的插件：这不是我真正使用的插件，但这是我测试的开始，以便全面了解。

HTML：

<div id="div"></div>

使用Javascript：

var plugin = $('#div').plugin();

plugin.message.set('hi');
alert(plugin.message.get());

我缺少的是能够在元素上创建插件的一个实例，并使用它来获取和设置属性：

我假设我的设置有点像下面，有人可以填补空白吗？我不知道如何调用方法'get'作为示例以及如何通过...传递参数

$.fn.plugin = function () {
    var target = this;

    methods: {

        var message = {
            get: function () {
                return $(target).text();
            },
            set: function () {
                $(target).text(message);
            },
        };

    };

};

Answer 1

这是jQuery插件的常用基本框架：

(function($)
{
    var parameters = 
    {
        myDefault: "default"
    };

    var methods = {
        init : function(options) {
            return this.each(function() {
                parameters = $.extend(parameters, options);
            });
        },
        myMethod: function(){}
    };

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

})(jQuery);

以这种方式使用：

<强>初始化

$('#myDiv').myPlugin({
    myDefault: "override"
});

这将调用init方法，在这种情况下会更改默认参数。

调用方法

$('#myDiv').myPlugin('myMethod');

在此处查看更多内容：http://learn.jquery.com/plugins/basic-plugin-creation/

jquery插件获取并设置消息

1 个答案: