layer弹出框的简易封装和使用

1. 封装layer

下载layer绿色版和jquery引入页面

    <!DOCTYPE html>
    <html lang="zh-CN">
    .
    .
    .
    <script src="/Public/js/jquery.js"></script>
    <script src="/Public/js/dialog/layer.js"></script>
    <script src="/Public/js/dialog.js"></script>
    </body>
    </html>

2. 封装dialog.js

    var dialog = {
        // 错误弹出层
        error: function(message) {
            layer.open({
                content:message,
                icon:2,
                title : '错误提示',
            });
        },
    
        //成功弹出层
        success : function(message,url) {
            layer.open({
                content : message,
                icon : 1,
                yes : function(){
                    location.href=url;
                },
            });
        },
    
        // 确认弹出层
        confirm : function(message, url) {
            layer.open({
                content : message,
                icon:3,
                btn : ['是','否'],
                yes : function(){
                    location.href=url;
                },
            });
        },
    
        //无需跳转到指定页面的确认弹出层
        toconfirm : function(message) {
            layer.open({
                content : message,
                icon:3,
                btn : ['确定'],
            });
        },
    }

使用的时候在js中直接dialog.error("提示信息")即可实现layer的效果

posted @ 2019-11-05 10:57  if年少有为  阅读(1026)  评论(0)  编辑  收藏  举报