layui弹层同时弹出多个

解决layer点击多次(重复)弹出,layuiAdmin点击弹出框叠加弹出多个的问题

这个问题其实是疏忽了一些 基础参数(仔细看文档,仔细看文档,仔细看文档)

一、type - 基本层类型

类型:Number,默认:0

layer提供了5种层类型。可传入的值有:0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)。 若你采用layer.open({type: 1}) 方式调用,则 type为必填项(信息框除外)

二、id - 用于控制弹层唯一标识

类型:String,默认:空字符

设置该值后,不管是什么类型的层,都只允许同时弹出一个。一般用于页面层和 iframe 层模式

当 layer 弹层同时出现多个时,设置一个 ID 即可解决此问题。

示例:

layer.open({
    type: 1
    ,title: false //不显示标题栏
    ,closeBtn: false
    ,area: '300px;'
    ,shade: 0.8
    ,id: 'LAY_layuipro' //设定一个id,防止重复弹出
});

 

  • 4
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
可以使用 layuilayer 组件来弹出多个窗口。具体操作如下: 1. 引入 layuilayer 组件: ```html <link rel="stylesheet" href="https://cdn.staticfile.org/layui/2.5.6/css/layui.min.css" integrity="sha384-KD7tJuF1jZkxcJ7l+u2RmY1WVX9iCvOo5lwJ4LsBc5G3m6I00JLXQzXHc+JyF0KA" crossorigin="anonymous"> <script src="https://cdn.staticfile.org/layui/2.5.6/layui.min.js" integrity="sha384-+iQ5tK+qXsW5gW+8Wpy2ng6v7xZ6j0z5eJ2xN+qLNYwl6Xz9L7HL14XGu7z+J2a4" crossorigin="anonymous"></script> ``` 2. 使用 layer.open() 方法弹出窗口,可以传入不同的配置项参数来控制窗口的样式和内容。例如: ```javascript // 弹出一个普通窗口 layer.open({ type: 1, title: '普通窗口', content: '这是一个普通窗口' }); // 弹出一个iframe层 layer.open({ type: 2, title: 'iframe层', area: ['800px', '600px'], content: 'http://www.baidu.com' }); // 弹出一个自定义HTML层 layer.open({ type: 1, title: '自定义HTML层', area: ['500px', '300px'], content: '<div style="padding: 20px;">这是一个自定义HTML层</div>' }); ``` 3. 如果需要弹出多个窗口,可以在每次调用 layer.open() 方法时传入不同的配置项参数,例如: ```javascript // 弹出第一个窗口 layer.open({ type: 1, title: '窗口1', content: '这是第一个窗口' }); // 弹出第二个窗口 layer.open({ type: 1, title: '窗口2', content: '这是第二个窗口' }); // 弹出第三个窗口 layer.open({ type: 1, title: '窗口3', content: '这是第三个窗口' }); ``` 这样就可以弹出多个窗口了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值