13.弹出层.下

news/2024/12/23 4:51:16/
学习要点:
1. 基础参数
本节课我们来开始了解 Layui 的内置模块:弹出层的方法演示。
一.基础参数
1. 参数,我们主要通过 open 方法来演示,其它方法类似;
layer . open ({
// 标题
title : ' 标题 ' ,
// 内容
content : ' 这是内容 ~' ,
//icon 图标,默认信息框 -1 ,其余 0-6
icon : 6 ,
//3 秒后自动关闭
time : 5000 ,
// 动画效果 0-6
anim : 0 ,
// 设置宽高
area : [ '400px' , '250px' ],
// 坐标,默认居中,值较多,看手册
offset : 'auto' ,
})
PS :这里还有一些其它效果:滚动、拉伸、固定、拖拽、动画、遮罩、最大最小等;
2. 除了 open 方法,其它方法都有各种按钮和固定回调, open 都可以实现;
layer . open ({
// 标题
title : ' 标题 ' ,
// 内容
content : ' 这是内容 ~' ,
// 按钮
btn : [ ' 确定 ' , ' 取消 ' ],
// 回调设置: btn1 表示第一个按钮,以此类推
// 当然, btn1 也可以改为 yes ,表示第一个 btn
// 参数 index 表示当前弹窗的下标,也就是第几个
// 参数 layero 表示当前的弹窗对象
btn1 ( index , layero ) {
alert ( layero )
},
// 右上角关闭按钮的回调
cancel ( index , layero ) {
alert ( index )
},
// 弹窗创建完毕时执行这个回调
success ( layero , index ) {
alert ( index )
},
// 按钮的排列, l,c,r
btnAlign : 'l' ,
// 关闭按钮的样式 :0-2 0 表示不显示
closeBtn : 1 ,
})
3. 还有其余的比较实用的弹窗,比如 tips 吸附、 iframe 框架;
layer . tips ( ' 吸附 ' , '#btn-tips' )
layer . open ({
// 必须设置类型 2 iframe
type : 2 ,
content : [ 'http://www.baidu.com' , 'no' ]
})
PS :剩下还有一些方法和参数,都比较重复,可以查阅学习;
PS :由于手册没有案例,本身它还提供了一个案例页面,如下:

http://www.ppmy.cn/news/48406.html

相关文章

004+limou+C语言链表之“有头双向有循环链表”的实现

0、前要 如果您是初步认识链表,或是不能完全“手撕”一个简单的单链表,可以看看我的上一篇有关“无头单向非循环链表”的实现,再来看这一篇文章 1、“有头双向有循环链表”的实现 (0)首先阐述两个节点的区别 头节点…

PostMan笔记(三)自动化测试

1. 简介 Postman是一款功能强大的API开发工具,也是一款流行的自动化测试工具。它提供了多种测试功能,包括测试脚本、预请求脚本和测试集合等。 1.1 测试脚本 测试脚本是Postman中用于自动化测试的核心部分。它可以使用JavaScript语言编写,…

WuThreat身份安全云-TVD每日漏洞情报-2023-04-19

漏洞名称:vm2 沙箱逃逸漏洞 漏洞级别:严重 漏洞编号:CVE-2023-29199,CNNVD-202304-1191 相关涉及:vm2 3.9.16 之前版本 漏洞状态:POC 参考链接:https://tvd.wuthreat.com/#/listDetail?TVD_IDTVD-2023-09144 漏洞名称:Linux 内核蓝牙子系统中存在 RCE 漏洞 漏洞级别:高危 漏洞…

LDMUI-001 61320946C模拟量模件的40端即直流24伏的负端接至逻辑地汇流排上

LDMUI-001 61320946C模拟量模件的40端即直流24伏的负端接至逻辑地汇流排上 ​ 八、现场接地常用注意事项 1.现场控制站 接地螺丝因机柜本体与底座间有胶皮形成绝缘,屏蔽地汇流排与底座间绝缘,现场控制站必须按规定做好接地处理。即分别接至现场控制站接…

#Chrome扩展程序开发教程--07:消息传递

#Chrome扩展程序开发教程--07:消息传递 引言1、基本介绍2、简单通信3、长时间通信4、其它通信4.1、Cross-extension messaging4.2、Sending messages from web pages4.3、Native messaging 引言 本系列博客旨在带来最新的Chrome扩展程序开发入门教程。 1、基本介绍 …

2023-03-18青少年软件编程(C语言)等级考试试卷(四级)解析

2023-03-18青少年软件编程(C语言)等级考试试卷(四级)解析T1、最佳路径 如下所示的由正整数数字构成的三角形: 7 3 8 8 1 0 2 7 4 4 4 5 2 6 5 从三角形的顶部到底部有很多条不同的路径。对于每条路径,把路径上面的数加起来可以得到一个和,和最大的路径称为最佳路径。你的…

DAY 40 firewalld 防火墙

firewalld防火墙是centos7系统默认的防火墙管理工具,取代了之前的iptables防火墙,也是工作在网络层,属于包过滤防火墙。 支持IPv4、IPv6防火墙设置以及以太网桥支持服务或应用程序直接添加防火墙规则接口拥有两种配置模式:临时模…

CF 607B - Zuma(区间 dp 记忆化搜索写法)

记搜大法好 Zuma 题面翻译 题目描述 Genos最近在他的手机上下载了祖玛游戏。在祖玛游戏里,存在n个一行的宝石,第i个宝石的颜色是Ci 。这个游戏的目标是尽快的消灭一行中所有的宝石。 在一秒钟,Genos能很快的挑选出这些有颜色的宝石中的一个…