layer.open中的js解释 (右上角“X“关闭按钮触发的回调)

本文链接：https://blog.csdn.net/qq_70095877/article/details/129972745

layer.open是layui框架中的弹出层方法，用于创建对话框、提示框等。配置项对象包括type（弹出层类型）、title（标题）、content（内容）、area（宽高）、offset（坐标）、closeBtn（关闭按钮）、shade（遮罩层）、time（自动关闭时间）、btn（按钮）、yes和cancel（回调函数）。示例展示了如何创建一个弹出层并设置相关参数，以及如何通过返回的索引关闭弹出层。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

概述 :

layer.open是一个弹出层的方法，属于layui框架中的模块，可以用于在页面中弹出对话框、提示框、确认框等。其语法格式为：

layer.open(options);

解释 :

其中，options是一个配置项对象，用于设置弹出层的参数，包括以下属性

1. type：弹出层类型，默认为0，表示信息框。可以设置为1表示页面层、2表示iframe层、3表示加载层、4表示tips层。
2. title：弹出层的标题，可以是一个字符串，也可以是一个HTML元素。
3. content：弹出层的内容，可以是一个字符串，也可以是一个DOM元素的选择器，或者是一个HTML元素。
4. area：弹出层的宽高，可以是一个字符串，如“500px”、“80%”等，也可以是一个数组，如[“500px”, “300px”]。
5. offset：弹出层的坐标位置，可以是一个字符串，如“100px”、“t”、“r”等，也可以是一个数组，如[“100px”, “50px”]。
6. closeBtn：弹出层的关闭按钮，可以设置为0表示不显示关闭按钮。
7. shade：弹出层的遮罩层，可以设置为false表示不显示遮罩层，也可以设置为一个数字表示遮罩层的透明度。
8. time：弹出层的自动关闭时间，单位为毫秒。
9. btn：弹出层的按钮，可以是一个数组，每个元素表示一个按钮，如[{text: '确认', onclick: function(){}}]。
10. yes：弹出层的确认回调函数。
11. cancel：弹出层的取消回调函数。

案例 :

layer.open方法返回一个弹出层的索引，可以用于关闭弹出层。例如：

var index = layer.open({
    type: 1,
    title: '弹出层',
    content: '这是一个弹出层',
    area: ['500px', '300px'],
    offset: '100px',
    closeBtn: 0,
    shade: 0.5,
    time: 3000,
    btn: ['确认', '取消'],
    yes: function(index, layero){
                    layer.close(index);
                },
    cancel: function(index, layero){
                      layer.close(index);
            }
     });

可以通过layer.close(index)方法关闭弹出层。