Layui中Layer弹出层右上角X关闭按钮样式修改

由于项目刚好用到layer弹出层，于是我使用了layer.open()做了一个页面层的弹出效果，但是在做的过程中我发现右上角的关闭按钮并不是自己想要的样式，于是对以下代码进行了修改。

修改前的关闭按钮样式：

修改后的关闭按钮样式：

修改前代码：

//页面层
   layer.open({
            type: 1,
            title:false,
            skin: 'layui-layer-demo', //样式类名
            area: ['420px', '240px'], //宽高
            content: 'html内容',
            success: function (layero, index) {
                layero[0].childNodes[1].childNodes[0].removeAttribute('href');
                layero[0].childNodes[1].classList.add('cursorStyle');
            },
        });

修改后代码：

 //页面层
        layer.open({
            type: 1,
            title:false,
            area: ['420px', '240px'], //宽高
            skin: 'layui-layer-demo', //样式类名
            content: 'html内容',
            success: function (layero, index) {
                layero[0].childNodes[1].childNodes[0].removeAttribute('href');
                layero[0].childNodes[1].classList.add('cursorStyle');
                layero[0].childNodes[1].childNodes[0].classList.remove('layui-layer-close2');
                layero[0].childNodes[1].childNodes[0].classList.add('layui-layer-close1');
            },
        });

两段代码区别主要在成功回调时，下面的代码去掉了一个类名，并且又新增了一个类名

---

在layui的弹出层数据调用

在使用“编辑”按钮时，要使用弹出层，并且要将当前所选项的值传递给弹出子页面。

父层：

function editUser(edit){
    var index = layui.layer.open({
        title : "编辑用户",
        type : 2,
        content : "uIAction_page_user_userEdit",//弹出层页面
        area: ['500px', '560px'],
        success : function(layero, index){
            var body = layui.layer.getChildFrame('body', index);
            if(edit){
                // 取到弹出层里的元素，并把编辑的内容放进去
                body.find(".id").val(edit.id);  //将选中的数据的id传到编辑页面的隐藏域，便于根据ID修改数据
                body.find(".password").val(edit.password);  //密码
                body.find(".userEndTime").val(edit.userEndTime);  //登录时间
                body.find(".userName").val(edit.userName);  //登录名
                body.find(".userEmail").val(edit.userEmail);  //邮箱
                body.find(".userSex input[value="+edit.userSex+"]").prop("checked","checked");  //性别，单选按钮
                body.find(".userGradeHide").val(edit.userGradeId);  //会员等级，注意：这里我只把等级ID放到弹出层页面的隐藏域，然后再使用ajax查询等级列表，动态生成下拉列表
                body.find(".userStatus").val(edit.userStatus);    //用户状态
                body.find(".userDesc").text(edit.userDesc);    //用户简介
                // 记得重新渲染表单
                form.render();
            }
            setTimeout(function(){
                layui.layer.tips('点击此处返回用户列表', '.layui-layer-setwin .layui-layer-close', {
                    tips: 3
                });
            },500)
        }
    })

子层

<form class="layui-form" style="width:80%;">
    <div class="layui-form-item layui-row layui-col-xs12">
        <label class="layui-form-label">登录名</label>
        <div class="layui-input-block">
            <!-- 使用隐藏域用于保存编辑项的ID值，便于提交修改 -->
            <input type="hidden" class="id" name="id">
            <input type="hidden" class="password" name="password">
            <input type="hidden" class="userEndTime" name="userEndTime">
            <input type="text" class="layui-input userName" lay-verify="required" placeholder="请输入登录名" disabled>
        </div>
    </div>
    <div class="layui-form-item layui-row layui-col-xs12">
        <label class="layui-form-label">邮箱</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input userEmail" lay-verify="email" placeholder="请输入邮箱">
        </div>
    </div>
</form>