簡體   English   中英

需要幫助修改我的jQuery插件

[英]Need help modifing my jQuery plugin

由於我的插件不使用選擇器調用(不確定如何調用),因此我想刪除它。

// my plugin wrapper
;(function (root, factory) {
    if (typeof define === 'function' && define.amd) {
        define(['jquery'], factory);
    } else {
        factory(root.jQuery);
    }
}(this, function ($) {
    //"use strict"; // jshint ;_;
    var pluginName = 'myCustomPlugin';
    function Plugin(element, options) {
        this.obj = $(element);
        this.o = $.extend({}, $.fn[pluginName].defaults, options);
        this.init();
    };

    Plugin.prototype = {
        init: function () {
        },
        show: function (text) {
            alert(text);
        },
        destroy: function () {
            this.obj.removeData(pluginName);
        }
    };

    $.fn[pluginName] = function (option, param) {
        return this.each(function () {
            var $this = $(this);
            var data = $this.data(pluginName);
            var options = typeof option == 'object' && option;
            if (!data) {
                $this.data(pluginName, (data = new Plugin(this, options)))
            }
            if (typeof option == 'string') {
                data[option](param);
            }
        });
    };

    $.fn[pluginName].defaults = {
        option1: '',
        option2: ''
    };
}));

目前,我以如下方式實例化插件:

$('body').myCustomPlugin();
$('body').myCustomPlugin('show', 'Hello world');

我想將其更改為使用以下格式:

$.myCustomPlugin();
$.myCustomPlugin('show', 'Hello world');

像這樣添加一些

        $[pluginName] = function() {
            var $body = $(document.body);
            $body[pluginName].apply($body, arguments);
        }

到包裝的末尾。 你會得到

    // my plugin wrapper
    ;(function (root, factory) {
        if (typeof define === 'function' && define.amd) {
            define(['jquery'], factory);
        } else {
            factory(root.jQuery);
        }
    }(this, function ($) {
        //"use strict"; // jshint ;_;
        var pluginName = 'myCustomPlugin';
        function Plugin(element, options) {
            this.obj = $(element);
            this.o = $.extend({}, $.fn[pluginName].defaults, options);
            this.init();
        };

        Plugin.prototype = {
            init: function () {
            },
            show: function (text) {
                alert(text);
            },
            destroy: function () {
                this.obj.removeData(pluginName);
            }
        };

        $.fn[pluginName] = function (option, param) {
            return this.each(function () {
                var $this = $(this);
                var data = $this.data(pluginName);
                var options = typeof option == 'object' && option;
                if (!data) {
                    $this.data(pluginName, (data = new Plugin(this, options)))
                }
                if (typeof option == 'string') {
                    data[option](param);
                }
            });
        };

        $.fn[pluginName].defaults = {
            option1: '',
            option2: ''
        };

        // Call directly from jQuery on 'body'
        $[pluginName] = function() {
            var $body = $(document.body);
            $body[pluginName].apply($body, arguments);
        }
    }));

試試看:

$.extend({
    yourPluginName: function (param1, param2) {
        // constructor function here
    }
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM