javascript&&jquery编写插件模板

javascrpt插件编写模板

这里不分享如何编写插件,只留一个框架模板,使用面向对象的形式进行编写,方便管理

;(function(window,document){
    function FnName(options) {
        //变量定义区
        var name = "foo";

        //默认参数
        var defaults = {

        };

        //如果未传递参数则使用默认参数
        this.ops = options || {};
        for (var i in defaults) {
            if (typeof options[i] === 'undefined') {
                options[i] = defaults[i];
            } else if (typeof options[i] === 'object') {
                for (var deepDef in defaults[i]) {
                    if (typeof options[i][j] === 'undefined') {
                        options[i][j] = defaults[i][j];
                    }
                }
            }
        }

        //初始化函数
        this.init();
        this.bindEvent();
    }
    //构造函数指向自己本身
    FnName.prototype.constructor = FnName;

    //初始化入口函数
    FnName.prototype.init = function(){

    };

    //时间处理函数,建议所有事件处理放入此处
    FnName.prototype.bindEvent = function(){

    };

    //对外暴露的接口
    function fnName(options) {
        return new FnName(options);
    }

}(window,document));

jquery编写插件模板

; (function ($, window, document, undefined) {
    "use strict";
    //默认参数
    var defaults = {

    };

    function FnName($ele, options) {
        //jquery对象
        this.$ele = $ele;
        this.options  = $.extend(defaults, options || {});
        this.init();
    }

    FnName.prototype = {
        //构造函数指向自己
        constructor: FnName,
        //整体入口函数
        init: function () {
            this.bindEvent();
        },
        //事件绑定函数
        bindEvent: function () {

        }
    };


    $.fn.fnName = function (options) {
        //实例化构造函数
        return new FnName($(this), options);
    }

})(jQuery, window, document);
原文地址:https://www.cnblogs.com/shiyou00/p/7366453.html