layui弹出层:使用icon图标小结
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图标小结”的全部内容。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构