7 Star 21 Fork 0

辰辰徐徐/xlert

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
index.html 3.79 KB
一键复制 编辑 原始数据 按行查看 历史
YouYaX 提交于 2019-01-03 13:30 . submit
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="youyax">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script src="./xlert.js" type="text/javascript"></script>
<title>xlert弹框插件</title>
</head>
<body>
<center>
<h1>xlert弹框插件</h1>
<h3>(狄默默斯基作品)描述</h3>
<p>用于代替系统自带alert的解决方案</p>
<div style="width:100%;text-align:left;">
<h3>网站引用方式</h3>
<pre class="brush: javascript"><script src="./xlert.js" type="text/javascript"></script></pre>
<h3>配置参数演示</h3>
<p>带回调函数,格式为JSON字符串
<pre class="brush: javascript">
xlert({
content:'<span style="color:#ff0000;">错误提示</span> <br> 内容不能为空!',
pos:2, //1、警告,2、错误,3、正确,4、疑问
callback:function(){
alert('回调原来的alert');
},
});</pre><input type="button" value='运行' onclick="runall()"></p>
<p>简易参数,格式为2个字符串参数
<pre class="brush: javascript">
xlert('恭喜,注册成功!',3); </pre><input type="button" value='运行' onclick="run()"></p>
<p>默认错误型,格式为1个字符串参数
<pre class="brush: javascript">
xlert('操作错误!'); </pre><input type="button" value='运行' onclick="runerror()"></p>
<p>iframe嵌套页面
<pre class="brush: javascript">
xlert({
title:"京东商城",
width:"500",
height:"400",
src:"https://m.jd.com/"
});</pre><input type="button" value='运行' onclick="runiframe()"></p>
<p>confirm信息
<pre class="brush: javascript">
xlert({
confirm:{
title:"提示信息",
content:"确定删除这条信息吗?",
okfun:function(){
xlert('恭喜,删除成功!',3);
},
ccfun:function(){
xlert('错误,已取消!',2);
}
}
});</pre><input type="button" value='运行' onclick="runconfirm()"></p>
<p>loading等待
<pre class="brush: javascript">
var index = xlert({loading:true});
setTimeout(function(){
xlert({loading:{close:index}});
},3000);</pre><input type="button" value='运行' onclick="runloadding()"></p>
<p>提示层
<pre class="brush: javascript">
var index = xlert({msg:'数据加载中…'});
setTimeout(function(){
xlert({msg:{close:index}});
},3000);</pre><input type="button" value='运行' onclick="runmsg()"></p>
</div>
</center>
<script>
function runall(){
xlert({
content:'<span style="color:#ff0000;">错误提示</span> <br> 内容不能为空!',
pos:2, //1、警告,2、错误,3、正确,4、疑问
callback:function(){
alert('回调原来的alert');
},
});
}function run(){
xlert('恭喜,注册成功!',3);
}function runerror(){
xlert('操作错误!');
}
function runiframe(){
xlert({
title:"京东商城",
width:"500",
height:"400",
src:"https://m.jd.com/"
});
}
function runconfirm(){
xlert({
confirm:{
title:"提示信息",
content:"确定删除这条信息吗?",
okfun:function(){
xlert('恭喜,删除成功!',3);
},
ccfun:function(){
xlert('错误,已取消!',2);
}
}
});
}
function runloadding(){
var index = xlert({loading:true});
setTimeout(function(){
xlert({loading:{close:index}});
},3000);
}
function runmsg(){
var index = xlert({msg:'数据加载中…'});
setTimeout(function(){
xlert({msg:{close:index}});
},3000);
}
</script>
<h3>下载地址:</h3>
<a target="_blank" href="https://gitee.com/youyax/xlert">https://gitee.com/youyax/xlert</a>
</body>
</html>
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
JavaScript
1
https://gitee.com/youyax/xlert.git
git@gitee.com:youyax/xlert.git
youyax
xlert
xlert
master

搜索帮助