[Layer] layui的弹出层用法记录

为了更方便自己的使用和查找，把常用的代码记录一下，省的老去翻文档了。

通用加载提示：

layer.msg('加载中...',{icon: 16,time:false,shade:0.6});

layer.load(2, { shade: false });

完成提示加关闭当前layer

layer.alert('保存成功！', { icon: 1 }, function () {
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(index);
                            });

更多

   //基础提示
    document.getElementById('Button1').onclick = function () {
        layer.msg('玩命提示中');
    }

    //加载中
    document.getElementById('Button2').onclick = function () {
        var index = layer.load(0, { shade: false }); //0代表加载的风格，支持0-2
        setTimeout(function () {
            layer.closeAll('loading');//关闭加载
        }, 2000);
    }

    //右下角iframe弹窗
    document.getElementById('Button3').onclick = function () {
        layer.open({
            type: 2,
            closeBtn: 1, //关闭按钮显示
            title: "提示！", //标题
            shade: [0],
            area: ['340px', '215px'],
            offset: 'rb', //右下角弹出
            time: 5000, //自动关闭时间
            anim: 2,
            content: ['HtmlPage2.html', 'no'], //iframe的url，no代表不显示滚动条
            end: function () { //关闭后回调函数
                alert('aaa');
            }
        });
    }

    //好牛逼的iframe弹窗
    document.getElementById('Button4').onclick = function () {
        // layer.open({
        //     type: 2,
        //     title: '标题标题',
        //     shadeClose: true,
        //     shade: false,
        //     maxmin: true, //开启最大化最小化按钮
        //     area: ['893px', '600px'],
        //     content: 'HtmlPage2.html'
        // });

        layer.open({
            type: 2,
            title: '查看详情',
            shadeClose: false, 
            shade: [0.3, '#393D49'],
            maxmin: false,
            area: ['893px', '550px'],
            content: 'stu/other/stuScoringDetails'//这里需要公告查看子页面，传id在弹窗打开
        });

    }

    //位置提示tips
    document.getElementById('Button5').onmouseover = function () {

        layer.tips('这里是一些内容提示！', '#Button5', {
            tips: [1, '#76d4f5'],
            time: 4000
        });
    }

    //基础alert
    document.getElementById('Button6').onclick = function () {
        layer.alert('提示内容', { icon: 1 ,title: '信息'})
    }


    //基础confirm
    document.getElementById('Button7').onclick = function () {
        layer.confirm('您是如何看待前端开发？', {
            btn: ['确定', '取消'] //按钮
        }, function () { //确定按钮回调

            //更好看的提示
            layer.msg('的确很重要', { icon: 1 });

        }, function () { //取消按钮回调

            layer.msg('也可以这样', {
                time: 20000, //20s后自动关闭
                btn: ['明白了', '知道了']
            });
        });

    }