layui 动态显示弹框和关闭弹框

1.html 放在body内

<div  style="display: none" id="labeladdBox">
    <form  class="layui-form" style="margin-top: 50px;">
        <div class="layui-form-item">
            <label class="layui-form-label">上级</label>
            <div class="layui-input-block">
                <select name="pid" id="labelListpid">
                    <option value="0">根目录</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">名称</label>
            <div class="layui-input-block">
                <input type="text" class="form-control" id="labelname" name="name" placeholder="请输入名称">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">排序</label>
            <div class="layui-input-block">
                <input type="text" class="form-control" id="labelsort" name="sort" placeholder="请输入排序号">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">是否展示</label>
            <div class="layui-input-block">
                <input type="radio" name="isshow" value="1" title="是" checked="">
                <input type="radio" name="isshow" value="0" title="否">
            </div>
            <div class="layui-form-mid layui-word-aux">根目录除外，默认其他层级是否显示</div>
        </div>
    </form>
    <div style="width: 100%;text-align: center">
        <button type="button" class="layui-btn layui-btn-normal" style="width: 200px;" onclick="submitLabel()">提交数据</button>
    </div>
</div>
</body>

2.js代码定义模态框常量

 var addLabelmodel;

3.赋值显示

addLabelmodel = layer.open({
                                        type: 1,
                                        skin: 'layui-layer-rim', //加上边框
                                        area: ['800px', '640px'], //宽高
                                        content: $("#labeladdBox"),
                                        cancel: function(){
                                            // 右上角关闭事件的逻辑
                                            $("#labeladdBox").hide();
                                        },
                                    });

4.隐藏

layer.close(addLabelmodel);
$("#labeladdBox").hide();