2019-11-24 06:23:48 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<title>okLayx</title>
|
2019-12-17 02:24:03 +00:00
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
2019-11-28 04:14:20 +00:00
|
|
|
<link rel="stylesheet" href="../../css/oksub.css">
|
2019-11-24 06:23:48 +00:00
|
|
|
</head>
|
|
|
|
|
<body>
|
2019-12-17 02:24:03 +00:00
|
|
|
<div class="ok-body">
|
|
|
|
|
<blockquote class="layui-elem-quote">
|
|
|
|
|
<p>Layx 新一代Web弹窗组件。</p>
|
|
|
|
|
</blockquote>
|
|
|
|
|
<pre>
|
|
|
|
|
// Step1. 引入依赖
|
|
|
|
|
let okLayx = layui.okLayx;.
|
|
|
|
|
|
|
|
|
|
<br/>
|
|
|
|
|
// Step2. 使用
|
|
|
|
|
okLayx.notice({
|
|
|
|
|
title: "消息提示",
|
|
|
|
|
message: "我是消息提示消息提示消息提示消息提示"
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
okLayx.notice({
|
|
|
|
|
title: "成功提示",
|
|
|
|
|
type: "success",
|
|
|
|
|
message: "我是消息提示消息提示消息提示消息提示"
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
okLayx.notice({
|
|
|
|
|
title: "警告提示",
|
|
|
|
|
type: "warning",
|
|
|
|
|
message: "我是消息提示消息提示消息提示消息提示"
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
okLayx.notice({
|
|
|
|
|
title: "错误提示",
|
|
|
|
|
type: "error",
|
|
|
|
|
message: "我是消息提示消息提示消息提示消息提示"
|
|
|
|
|
});
|
|
|
|
|
</pre>
|
|
|
|
|
<button type="button" class="layui-btn" id="notice">消息提示</button>
|
|
|
|
|
<button type="button" class="layui-btn" id="notice2">成功提示</button>
|
|
|
|
|
<button type="button" class="layui-btn" id="notice3">警告提示</button>
|
|
|
|
|
<button type="button" class="layui-btn" id="notice4">错误提示</button>
|
|
|
|
|
</div>
|
2019-11-28 04:14:20 +00:00
|
|
|
<!--js逻辑-->
|
|
|
|
|
<script src="../../lib/layui/layui.js"></script>
|
2019-11-24 06:23:48 +00:00
|
|
|
<script>
|
2019-11-28 04:14:20 +00:00
|
|
|
layui.use(["code", "okLayx"], function () {
|
|
|
|
|
let code = layui.code;
|
|
|
|
|
let okLayx = layui.okLayx;
|
|
|
|
|
let $ = layui.jquery;
|
2019-12-17 02:24:03 +00:00
|
|
|
|
|
|
|
|
code({elem: "pre", title: "代码示例"});
|
2019-11-28 04:14:20 +00:00
|
|
|
|
|
|
|
|
$("#notice").click(function () {
|
|
|
|
|
okLayx.notice({
|
|
|
|
|
title: "消息提示",
|
|
|
|
|
message: "我是消息提示消息提示消息提示消息提示"
|
|
|
|
|
});
|
2019-11-24 06:23:48 +00:00
|
|
|
});
|
2019-11-28 04:14:20 +00:00
|
|
|
|
|
|
|
|
$("#notice2").click(function () {
|
|
|
|
|
okLayx.notice({
|
|
|
|
|
title: "成功提示",
|
|
|
|
|
type: "success",
|
|
|
|
|
message: "我是消息提示消息提示消息提示消息提示"
|
|
|
|
|
});
|
2019-11-24 06:23:48 +00:00
|
|
|
});
|
2019-11-28 04:14:20 +00:00
|
|
|
|
|
|
|
|
$("#notice3").click(function () {
|
|
|
|
|
okLayx.notice({
|
|
|
|
|
title: "警告提示",
|
|
|
|
|
type: "warning",
|
|
|
|
|
message: "我是消息提示消息提示消息提示消息提示"
|
|
|
|
|
});
|
2019-11-24 06:23:48 +00:00
|
|
|
});
|
2019-11-28 04:14:20 +00:00
|
|
|
|
|
|
|
|
$("#notice4").click(function () {
|
|
|
|
|
okLayx.notice({
|
|
|
|
|
title: "错误提示",
|
|
|
|
|
type: "error",
|
|
|
|
|
message: "我是消息提示消息提示消息提示消息提示"
|
|
|
|
|
});
|
2019-11-24 06:23:48 +00:00
|
|
|
});
|
2019-11-28 04:14:20 +00:00
|
|
|
});
|
2019-11-24 06:23:48 +00:00
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
