首页 > Web开发 > 详细

js组件常用封装方法。。。。。【组件封装】

时间:2019-12-18 11:25:12      阅读:1144      评论:0      收藏:0      [点我收藏+]

公共弹窗js写法:mcake弹窗封装Dialog.js

function Dialog(bg,els,opts) {
    this.$els = $(els);
    this.$Dialogbg = $(bg);
    this.$close = this.$els.find(opts.close);
    this.$btn = this.$els.find(opts.btn);
    this._init();
}
Dialog.prototype={
    _init:function () {
        var self = this;
        this.show();
        this.$Dialogbg.click(function () {
            self.hide();
        });
        this.$close.click(function () {
            self.hide();
        });
        this.$btn.click(function () {
            self.hide();
        });
    },
    show:function () {
        this.$Dialogbg.fadeIn(300);
        this.$els.fadeIn(300);
    },
    hide:function () {
        this.$Dialogbg.fadeOut(300);
        this.$els.fadeOut(300);
    }
};

/*实例化*/
new Dialog(".Dialogbg",‘.DialogBox‘,{
    close:‘.closes‘,
    btn:‘.go-use‘
});

 技术分享图片

 

js组件常用封装方法。。。。。【组件封装】

原文:https://www.cnblogs.com/shimily/p/12058664.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!