layui open配置及jquery事件绑定方式

layui open配置及jquery绑定

当content为一个 dom元素的时候，d出框出现异常
解决办法：  将type设置为 1,内容就正常了

 * 登录d框
    * */
    $('.loginFn').click(function () {
        layer.open({
            title: false,
            type: 1,
            content: $('#login-dial'),
            closeBtn: 0,
            success: function (layero, index) {
                $("a.layui-layer-btn0").hide()
            },
        });
        //    修改d窗样式
        $('#login-dial').css('padding', '21px')

    })

调整layui的d出框msg的字体大小以及其他样式

//文本里面可以加html标签
let sure = layer.msg('确定喜欢她吗？', {
        time: 0 //0表示不自动关闭 ,time自动关闭所需毫秒 ,单位是毫秒（1秒=1000毫秒）
        , btn: ['确定', '取消'],
           //success指的是 修改按钮的样式 三种样式left center right
           success: function(layero){
               layero.find('.layui-layer-btn').css('text-align', 'center')
           }
        , yes: function (index) {
            点击确定触发事件
        }
    });
//sure指的是上面的msgd出层，定义msgd出层的样式
layer.style(sure,{
    width:10px,
    height:10px
});

layui的d出框open常用的两种功能

let html = "这里面写任何html内容";
比如:let html ='\n' +
    '    \n' +
    '\n' +
    '';

  layer.open({
          type: 1 //Page层类型 
          ,area: ['720px', '500px']//d出层页面比例,类型：String/Array,默认：'auto',在默认状态下，layer是宽高都自适应的,但当你只想定义宽度时，你可以area: '500px'，高度仍然是自适应的。当你宽高都要定义时，你可以area: ['500px', '300px']
          ,offset:'auto'// 坐标 类型：String/Array  默认：垂直水平居中 offset默认情况下不用设置,
          // ,title: '照片上传'//title默认显示在左边，能拖动了
          ,title: ['照片上传','text-align:center']//传一个数组，第一个参数标题，第二个参数可以写任何css样式，能拖动
          // ,title: false//不显示title，但是不能拖动了
          ,shade: 0.6 //遮罩透明度 类型：String/Array/Boolean d层外区域。默认是0.3透明度的黑色背景（'#000'）。如果你想定义别的颜色，可以shade: [0.8, '#393D49']；如果你不想显示遮罩，可以shade: 0
          ,maxmin: true //允许全屏最小化
          ,anim: 1 //0-6的动画形式，-1不开启
          , content: html//在这里面输入任何合法的js语句
      });

 layer.open({
            type: 2 //2类型，解析url iframe层
            ,closeBtn: 1 //关闭按钮是否显示 1显示0不显示
            ,title: "我是标题"//页面标题
            ,shadeClose: true //点击遮罩区域是否关闭页面
            ,shade: 0.8 //遮罩透明度 类型：String/Array/Boolean d层外区域。默认是0.3透明度的黑色背景（'#000'）。如果你想定义别的颜色，可以shade: [0.8, '#393D49']；如果你不想显示遮罩，可以shade: 0
            ,area: ['600px', '600px'] //d出层页面比例
            ,content: 'XXX.html'//d出层的url,//这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['XXX.html', 'no']
        });

jquery绑定事件建议这种形式

    /*
   * 注册d框user_register
   * */
    $(document).on("click", "#user_register", function () {
        layer.open({
            title:'账户注册',
            type: 2,
            content: './register',
            // content: ['./register','no'],
            area: ['760px','690px'],
            shadeClose: true, //点击遮罩区域是否关闭页面
        });
        // //    修改d窗样式
        // $('#register-dial').css('width', '800px')
        // $('#register-dial').css('height', '800px')

    })

避免：

    /*
    * 登录d框user_SignIn
    * */
    $('#user_SignIn').click(function () {
        layer.open({
            title: false,
            type: 1,
            content: $('#login-dial'),
            closeBtn: 0,
            shadeClose: true, //点击遮罩区域是否关闭页面
            success: function (layero, index) {
                $("a.layui-layer-btn0").hide()
            },
        });
        //    修改d窗样式
        $('#login-dial').css('padding', '21px')

    })