JQuery插件的一般写法

最新推荐文章于 2024-09-02 11:39:24 发布

转载最新推荐文章于 2024-09-02 11:39:24 发布 · 82 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/KruceCoder/p/10231291.html

文章标签：

#javascript #ui #ViewUI

本文深入探讨了使用jQuery开发插件的方法，包括插件的基本结构、如何为jQuery扩展方法、默认配置的设置以及实例化插件的过程。通过具体示例，如创建分页功能插件，展示了插件开发的实用技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

(function($){
    //扩展这个方法到jQuery
    let Plugin = function(){

    }
    Plugin.prototype = {};
    $.fn.extend({
        //插件名字
        pluginname: function(options){
            let args = [].slice.call(arguments, 1);
            //遍历匹配元素的集合
            return this.each(function(){
                let ui = $._data(this, pluginname);
                if (!ui) {
                    let opts = $.extend(true, {}, $.fn.pluginname.defaults, typeof options === "object" ? options : {});
                    ui = new Plugin(opts, this);
                    $._data(this, pluginname, ui);
                }
                if (typeof options === "string" && typeof ui[options] === "function") {
                    ui[options].apply(ui, args);//执行插件的方法
                }
            });
        }
    });

    //默认配置
    $.fn.pluginname.defaults = {};

})(jQuery);

(function ($) {
    var ms = {
        init: function (obj, args) {
            return (function () {
                
            })();
        },
        //list li page
        listPage: function (obj, args) {
            
        },
        //动态添加html
        layoutHtml: function (obj, args) {
            return (function () {
                obj.empty();
                
                
            })();
        },
        //给分页、下一页、上一页绑定事件
        bindEvent: function (obj, args) {
            obj.unbind();
            return (function () {
                
            })();
        }
    }
    $.fn.createPaging = function (options) {
        var args = $.extend({
            pageCount: 30,
            currentPageCount: 30,
            current: 1
        }, options);
        ms.init(this, args);
    }
})(jQuery);