layui弹出层:使用icon图标小结
转自:https://www.cnblogs.com/webSnow/p/15470350.html
layui弹出层:使用icon图标小结
Layui 踩坑篇
layui的弹框插件layer中,有很多不同场景需要的弹框icon图标,今天小结一下,方便以后使用;

官方文档地址:https://layer.layui.com/(可能已停) 或 https://www.layui.site
表格示下:


icon截图 · 说明 建议场景 icon: 调用代码 调用代码示例
1 默认:无图标 任意 默认:无需设置 默认:无需设置
2 警示提醒类 0 icon: 0
3 成功提示类 1 icon: 1
4 错误返回类 2 icon: 2
5 交互问答类 3 icon: 3
6 禁止修改类 4 icon: 4
7 校验 不通过类 5 icon: 5
8 校验 通过类 6 icon: 6
9 加载层 layer.load(0, {shade: false}); //0代表加载的风格,支持0-2
10 loading层 layer.load(1, { shade: [0.1,'#fff'] //0.1透明度的白色背景 });
11 其他待定 暂略 暂略
调用代码:

layer.alert('验证码错误', {
icon: 0,
})
或
let msg = '返回的内容'
//错误信息提示
layer.alert(msg, {
skin: 'layui-layer-molv' //样式类名 自定义样式
,title:'信息反馈'
,closeBtn: 1 // 是否显示关闭按钮
,anim: 1 //动画类型
,btn: ['确定'] //按钮
,icon: 2 // icon
,yes:function(){
// window.location.reload();
layer.closeAll();
}
,end : function() {//右上方关闭按钮时候的回调
}
});

效果图大概如下
:
加
skin: 'layui-layer-molv'后的

以上就是关于“layui弹出层:icon图标小结”的全部内容。
layui弹出层:使用icon图标小结的更多相关文章
- layui弹出层之应用实例讲解
从酒店管理系统到智能门锁及其现在的资源共享平台,layui框架,我们团队用的比较多的就是这个layui弹出层. layui弹出层,除了页面iframe层我们比较常用还有就是表单校验和其他相关的友好提示 ...
- Layui 弹出层组件——layer的模块化开发实例应用
Layui 弹出层组件——layer的模块化开发实例应用 1.首先在package.json中引入layer组件依赖 2.在源码中应用这个依赖 3.在源码中编写代码应用此组件 4.效果验证:点击日历上 ...
- Layui弹出层、日期和时间选择、即时通讯、分页
Layui弹出层.日期和时间选择.即时通讯.分页 弹层组件文档 - layui.layer 对于弹出层的感觉是:layer 至今仍作为 layui 的代表作,她的受众广泛并非偶然,而是这数年来的坚持. ...
- layui弹出层回调的使用
<%@page language="java" contentType="text/html; charset=UTF-8"%> <%@ in ...
- layer/layui弹出层插件bug
<button class="layui-btn" lay-submit lay-filter="formDemo" id="layui-btn ...
- adminlte+layui框架搭建3 - layui弹出层
在amdinlte首页引入layui.js 和layui.css后添加代码 <script> layui.use(['layer'], function () { var layer = ...
- layui弹出层基础参数
一.type-层类型 类型:Number 默认为0(信息框); 1(页面层),可以在页面添加HTML内容 2(iframe层) 3(加载层)加载时显示的弹出框 4(tips层) 需要绑定ID就不展示 ...
- layui弹出层处理(获取、操作弹出层数据等)
要点: 字符串被渲染为弹窗层之后,回自动转换为DOM,可以使用jq进行各种操作 <!DOCTYPE html> <html> <head> <meta cha ...
- Layui弹出层详解
今天空了学习一下弹出层 还是一步步展示把 首先,layer可以独立使用,也可以通过Layui模块化使用.我个人一直是用的模块化的 所以下面素有的都是基于模块化的. 引入好相关文件就可以开始啦 今天放 ...
- layui弹出层layer点击关闭还会显示在html中
我的弹出层是这样定义的: 它的属性为display:none <div id="divlayer" style="display:none"> &l ...
随机推荐
- spring,springBoot配置类型转化器Converter以及FastJsonHttpMessageConverter,StringHttpMessageConverter 使用
转载请注明出处: https://i.cnblogs.com/posts/edit;postId=14045507 spring,spring boot 等框架项目通过@RequestBody,@Re ...
- 分享这位大神的WPF界面设计系列视频
本文结构: 前言 视频详情 搬运详情 总结 4.1 国内推荐WPF资源 4.2 B站是学习的天堂 4.3 去外面看看 4.4 个人给C/S同学建议 1. 前言 今天介绍油管上一个大佬发的WPF设计系列 ...
- [转帖]SkyWalking告警使用
SkyWalking告警 SkyWalking提供了强大的监控告警功能,在监控到应用出现问题的时候,会调用webhook或者gRPC hook或者Wechat DingDing等工具报告警告信息 而且 ...
- [转帖]TiKV & TiFlash 加速复杂业务查询
https://tidb.net/book/tidb-monthly/2022/2022-07/usercase/tikv-tiflash 背景 在互联网公司或传统公司的 CRM 系统中,最常用的功 ...
- [转帖]gdb进阶调试技巧
https://www.jianshu.com/p/9bdaa0644dba 整理一下在linux下C/C++用gdb工具debug一些提高效率的操作.基本的gdb操作就不在这里赘述了. 打印各种变量 ...
- 让你彻底理解Typescript中静态成员和抽象方法
1.Typescript中static详解 静态成员:在类中通过 static 修饰的属性或者方法 那么就是静态的属性静态方法 也称之为:静态成员(静态成员包含静态属性和静态方法) 静态成员在使用的时 ...
- 源码阅读:VictoriaMetrics中的golang代码优化方法
全文请移步:https://zhuanlan.zhihu.com/p/469239020 或关注我的公众号: 公众号:一本正经的瞎扯
- 【JS 逆向百例】房天下登录接口参数逆向
声明 本文章中所有内容仅供学习交流,严禁用于商业用途和非法用途,否则由此产生的一切后果均与作者无关,若有侵权,请联系我立即删除! 逆向目标 目标:房天下账号密码登录 主页:https://passpo ...
- GitHubDesktop汉化和下载
GitHubDesktop下载 这玩意官网下载速度特别慢 如果不想等待的可以戳下面链接进行下载 会实时同步更新的 下载地址:GitHubDesktop下载
- 根据pdf模板文件添加数据生成新的pdf与pdf添加读取二维码
参考文档 :https://www.cnblogs.com/ibeisha/p/itextsharp-pdf.html 程序demo 地址:https://github.com/hudean/itex ...