layerui

引用layer.js&＃xff0c;官网&＃xff1a;http://layer.layui.com/
常用属性&＃xff1a;btn/icon/skin/time/content/yes&＃xff08;点击确认、提交&＃xff09;

常用窗体
.alert

layer.alert("内容");
layer.alert(&＃39;墨绿风格&＃xff0c;点击确认看深蓝&＃39;, {skin: &＃39;layui-layer-molv&＃39;//样式类名, closeBtn: 0}, function () {
layer.alert(&＃39;偶吧深蓝style&＃39;, {skin: &＃39;layui-layer-lan&＃39;, closeBtn: 0, shift: 2 //动画类型});
});


.confirm

layer.confirm(&＃39;您是如何看待前端开发&＃xff1f;&＃39;,{
btn: [&＃39;重要&＃39;, &＃39;奇葩&＃39;] //按钮
}, function () {
layer.msg(&＃39;的确很重要&＃39;, { icon: 1 });
}, function () {
layer.msg(&＃39;也可以这样&＃39;, {
time: 20000, //20s后自动关闭
btn: [&＃39;明白了&＃39;, &＃39;知道了&＃39;]
},function() {
layer.msg(&＃39;明白就好&＃39;, { time: 20000 });
},function() {layer.msg(&＃39;知道就好&＃39;, { time: 20000 });});
});


.msg

layer.msg(&＃39;hello.&＃39;);


.open 自定义窗口

layer.open({
type: 1,
skin: &＃39;layui-layer-demo&＃39;,//样式类名
btn: ["关闭"],
/*closeBtn: 0, //不显示关闭按钮*/
shift: 2,
shadeClose: true, //开启遮罩关闭
content: &＃39;内容&＃39;
});
layer.open({type: 2,title: &＃39;layer mobile页&＃39;,shadeClose: true,shade: 0.8,area: [&＃39;700px&＃39;,&＃39;90%&＃39;],content: &＃39;http://layer.layui.com/mobile/&＃39;//iframe的url
});


.html

$("#layerOpen").html(&＃39;正在努力为您搜索&＃xff0c;请稍后...&＃39;);


.load 加载

$("#layerOpen").load("/Order/ProductList");


.tips
关闭layer
用一个变量存储弹窗&＃xff0c;在需要关闭的地方调用close方法

打开自定义页面

$("#layerOpen").html(&＃39;正在努力为您搜索&＃xff0c;请稍后...&＃39;);
$("#layerOpen").load("/Controller/Action");
layerOpen &＃61; layer.open({type: 1,title: "选择XXX",area: ["1000px","600px"],content: $("#layerOpen"),cancel: function () {$("#layerOpen").html("");}});


加载页面
保存变量&＃xff0c;打开页面赋值&＃xff0c;关闭页面

//加载layer
var load &＃61; null;
$.ajax({type: "POST",url: "/Controller/Action",data: {"PKID":PKID,"Path": path},beforeSend: function () {load &＃61; layer.load(0, { shade:[0.3, &＃39;#000&＃39;] });//0代表加载的风格&＃xff0c;支持0-2},success: function (result) {if (load !&＃61; null) {layer.close(load);}layer.alert(result.Msg, &＃39;提示&＃39;);}
});