您的位置：首页 > 其它

layer弹出层倒计时关闭的实现方法

2019-09-27 15:43 1091 查看

因为官方没有提供，只能自己实现了，包括按钮倒计时和标题倒计时，标题倒计时在注释部分：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
<script>
function func1() {
var i = 9;
var interval;
layer.confirm('是否提交？', {
btn: [i+1+'s后可提交','退出'], //按钮
skin: 'layui-layer-molv',
success: function(a,b){
$(".layui-layer-btn0").css("backgroundColor","#92B8B1");
var fn = function() {
//       layer.title(i+' 秒后，系统将自动退出并关闭。',b);
$(".layui-layer-btn0").text(i+'s后可提交');
i--;
};
interval = setInterval(function(){
fn();
if(i === 0){
$(".layui-layer-btn0").css("backgroundColor","#019F95");
$(".layui-layer-btn0").text('提交');
clearInterval(interval);
}
}, 1000);
},
end:function(){
clearInterval(interval);
}
}, function(){
if(i<=0) {
layer.msg('已提交', {icon: 1});
}

}, function(){
clearInterval(interval);
layer.msg('已关闭', {icon: 1});

});
}
</script>
<button id="func1" onclick="func1();">询问框</button>
</body>
</html>

以上这篇layer弹出层倒计时关闭的实现方法就是小编分享给大家的全部内容了，希望能给大家一个参考

您可能感兴趣的文章:

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： layer 弹出层倒计时关闭

相关文章推荐

新的分享

章节导航