zoukankan      html  css  js  c++  java
  • 基于Layer 封装JS

    var ZTLayer = {
        tips: function (content, target, time) {
            return layer.tips(content, target, { time: time || 3000 });
        },
        //关闭一个层
        close: function (index) {
            layer.close(index);
        },
        //显示遮罩层
        showLoading: function (time, style) {
            time = time || 0;
            style = style || 1
            return layer.load(style, { shade: [0.5, '#393D49'], time: time });
        },
        //关闭遮罩层
        closeLoading: function () {
            layer.closeAll('loading');
        },
        //弹出提示 icon类型 0:带!的提示 1:√ 2:x 3:? 4:锁 5:难过脸 6:微笑脸
        showTips: function (content, icon, time, callback) {
            icon = icon || 0;
            time = time || 3000;
            layer.msg(content, {
                icon: icon,
                time: time,
                resize: false,
                shade: 0.5,
                shadeClose: true
            }, function () {
                //do something
                if (callback) {
                    callback();
                }
            });
        },
        //与 JS alert相似
        alert: function (content, btnText, title) {
            layer.alert(content, { closeBtn: 1, btn: [btnText], title: title, resize: false })
        },
        //与JS confirm相似
        confirm: function (content, title, sureText, sureFunction, closeText, closeFunction) {
            title = title || "";
    
            layer.confirm(
                content, { title: title, icon: 3, btn: [sureText, closeText], resize: false },
                function (index) {//确定回调
                    if (sureFunction) {
                        sureFunction();
                    }
                    layer.close(index);
                }, function (index) {//cancel回调
                    if (closeFunction) {
                        closeFunction();
                    }
                    layer.close(index);
                });
        },
        openWindow: function (content, title, width, height) {
            title = title || "";
            width = width || 500;
            height = height || 500;
    
            var offset = ((window.screen.height - height) * 0.3) + 'px';
    
            return layer.open({
                title: title
                , content: content
                , type: 1
                , offset: offset //具体配置参考:http://www.layui.com/doc/modules/layer.html#offset
                , shade: 0.5 // 遮罩层透明度
                , resize: false
                , area: [width + 'px', height + 'px']
                , skin: 'layui-layer-rim'
            });
        },
        openIframe: function (url, title, width, height) {
            title = title || "";
            width = width || 500;
            height = height || 500;
            var offset = ((window.screen.height - height) * 0.3) + 'px';
    
            return layer.open({
                title: title
                , content: url
                , type: 2
                , offset: offset //具体配置参考:http://www.layui.com/doc/modules/layer.html#offset
                , shade: 0.5 // 遮罩层透明度
                , resize: false
                , area: [width + 'px', height + 'px']
                , skin: 'layui-layer-rim'
            });
        }
    };
  • 相关阅读:
    node异步转同步(循环)
    三级省市区PCASClass.js插件
    微信公众号基础总结(待更新)
    ES6详解
    webpack配置
    高性能 CSS3 动画
    github上传口令
    纯css3 实现3D轮播图
    优美的js代码,拿去玩~
    关于列举属性用点还是用【】
  • 原文地址:https://www.cnblogs.com/opts/p/9402847.html
Copyright © 2011-2022 走看看