root
/
ok-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add:okToastr使用方法

master
bobi 2019-11-02 13:35:40 +08:00
parent f4ae28b5a9
commit b121d28a18
2 changed files with 93 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
data/navs.json
View File

@ -410,23 +410,23 @@
"href": "pages/tripartite/countup.html"
},
{
"title": "okToastr.js",
"title": "okToastr",
"href": "pages/tripartite/okToastr.html"
},
{
"title": "okMd5.js",
"title": "okMd5",
"href": "pages/tripartite/okMd5.html"
},
{
"title": "okBarcode.js",
"title": "okBarcode",
"href": "pages/tripartite/okBarcode.html"
},
{
"title": "okNprogress.js",
"title": "okNprogress",
"href": "pages/tripartite/okNprogress.html"
},
{
"title": "okSweetalert2.js",
"title": "okSweetalert2",
"href": "pages/tripartite/okSweetalert2.html"
},
{

93
pages/tripartite/okToastr.html
View File

@ -8,19 +8,102 @@
</head>
<body>
<div class="ok-body">
<blockquote class="layui-elem-quote">
<p>toastr是非阻塞通知的JavaScript库</p>
</blockquote>
<pre>
layui.use(["okToastr"], function () {
// 引入okToastr
let okToastr = layui.okToastr;
// 是否显示关闭按钮
okToastr.options.closeButton = true;
// 回调函数
okToastr.options.onShown = function () {
console.log("hello");
}
okToastr.options.onHidden = function () {
console.log("goodbye");
}
okToastr.options.onclick = function () {
console.log("clicked");
}
okToastr.options.onCloseClick = function () {
console.log("close button clicked");
}
<br/>
// info
okToastr.info("ok-admin");
// success
okToastr.success("ok-admin");
// warning
okToastr.warning("ok-admin");
// error
okToastr.error("ok-admin");
// remove
okToastr.remove();
// clear
okToastr.clear();
});
</pre>
<button type="button" class="layui-btn" id="info">info</button>
<button type="button" class="layui-btn" id="success">success</button>
<button type="button" class="layui-btn" id="warning">warning</button>
<button type="button" class="layui-btn" id="error">error</button>
<button type="button" class="layui-btn" id="remove">remove</button>
<button type="button" class="layui-btn" id="clear">clear</button>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script>
layui.use(["okToastr"], function () {
layui.use(["code", "okToastr"], function () {
let code = layui.code;
let okToastr = layui.okToastr;
let $ = layui.jquery;
code({
elem: 'pre',
title: "代码示例"
});
// 是否显示关闭按钮
okToastr.options.closeButton = true;
// 回调函数
okToastr.options.onShown = function () {
console.log("hello");
}
okToastr.options.onHidden = function () {
console.log("goodbye");
}
okToastr.options.onclick = function () {
console.log("clicked");
}
okToastr.options.onCloseClick = function () {
console.log("close button clicked");
}
okToastr.info("ok-admin");
okToastr.success("ok-admin");
okToastr.warning("ok-admin");
okToastr.error("ok-admin");
$("#info").click(function () {
okToastr.info("ok-admin");
});
$("#success").click(function () {
okToastr.success("ok-admin");
});
$("#warning").click(function () {
okToastr.warning("ok-admin");
});
$("#error").click(function () {
okToastr.error("ok-admin");
});
$("#remove").click(function () {
okToastr.remove();
});
$("#clear").click(function () {
okToastr.clear();
});
});
</script>
</body>