layer 弹窗使用说明
1、参考
layer.msg参数含义及参数icon数字参数说明
2、代码
<!DOCTYPE html> <html lang="zh" xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>layer</title> </head> <body> <div style="margin-left: 50px;"> <input type="button" value="layerOpen" onclick="layerOpen()"> <br> <input type="button" value="showConfirm" onclick="showConfirm()"> <br> <input type="button" value="showOk" onclick="showOk()"> <br> <input type="button" value="showError" onclick="showError()"> <br> </div> </body> <script type="text/javascript" th:src="@{/js/jquery.min.js}"></script> <script type="text/javascript" th:src="@{/js/plugins/layer/layer.min.js}"></script> <script th:inline="javascript"> let ctx = [[@{/}]]; </script> <script type="text/javascript"> $(function () { }); function showOk() { layer.msg("<span style='color: #000'>成功</span>", {icon: 1, time: 2000}); } function showError() { layer.msg("<span style='color: #000'>失败</span>", {icon: 2, time: 2000}); } function showConfirm() { layer.confirm('是否执行动作?', { icon: 3, title: '执行动作', btn: ['确定', '取消'], //按钮 anim: 2, offset: '100px' }, function () { layer.msg("<span style='color: #000'>执行成功</span>", {icon: 1, time: 1500}); // $.ajax({ // url: "/tcc/manage/strategySet/drawOrderDelete", type: "post", // dataType: "json", data: {id: $(".id").text()}, // success: function (obj) { // console.log("drawOrderDelete", obj); // if (obj.code == 0) { // parent.layer.msg("<span style='color: #000'>删除成功</span>", {icon: 1, time: 1500}); // } else { // parent.layer.msg("<span style='color: #000'>删除失败</span>", {icon: 2, time: 1500}); // } // parent.layer.close(index); //再执行关闭 // } // }) }); } function layerOpen() { let width = 800; let height = ($(window).height() - 20); layer.open({ content: ctx + "/demo/openWindow", type: 2, area: [width + 'px', height + 'px'], fix: false, maxmin: true, shade: 0.3, title: "layerOpen", btn: ['确定', '清空', '删除', '关闭'], shadeClose: true,// 弹层外区域关闭 yes: function (index, layero) { // let iframeWin = layero.find('iframe')[0]; // iframeWin.contentWindow.drawOrderSubmit(index, layero); // return false; }, btn2: function (index, layero) { // let iframeWin = layero.find('iframe')[0]; // iframeWin.contentWindow.drawOrderClean(index, layero); // return false; }, btn3: function (index, layero) { // let iframeWin = layero.find('iframe')[0]; // iframeWin.contentWindow.drawOrderDelete(index, layero); // return false; }, cancel: function (index) { return true; } }); } </script> </html>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」
2019-06-07 Ajax 调用案例及错误捕捉