登录使用layer插件, 回车无限弹框bug解决
Posted fatcar
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了登录使用layer插件, 回车无限弹框bug解决相关的知识,希望对你有一定的参考价值。
前言
其实layer如果是人工点击的话,根本不用考虑这种问题。但是从客户的体验度,输入账号密码,一直回车可能是比较方便。。。
直接贴代码
html:
<form name="runlogin" id="runlogin" method="post" action=":url('Login/login')">
<li class="user_name"><input type="text" name="user_name" id="user_name" placeholder="用户名/手机号/学号" class="login_input"></li>
<li class="loginli"><input type="password" name="user_pwd" id="user_pwd" placeholder="请输入密码" class="login_input"></li>
<li class="loginli"><input type="submit" name="submit" id="submit" class="login_sub" value="登录"></li>
<li class="loginli"><a href=":url('register/index')" class="login_sub">注册</a></li>
</form>
js:
<script>
/*点击回车登录*/
$(document).on('keydown', function(e)
if(event.keyCode == 13)
e.preventDefault();//防止两次询问
if($(".layui-layer-btn0").length<1)
$("#runlogin").submit();
)
/*ajax处理弹出信息*/
$("#runlogin").submit(function(e)
e.preventDefault();//防止两次询问
var user_name = $("#user_name").val();
var user_pwd = $("#user_pwd").val();
$.ajax(
url:":url('login/login')",
type:'post',
data:'user_name':user_name,'user_pwd':user_pwd,
dataType: 'json',
success:function (data)
//登录失败,显示提示
if(data.code==0)
layer.alert(data.msg,
success: function()
$(document).on('keydown', function(e)
if(event.keyCode == 13)
// console.log($(".layui-layer-btn0").length);
e.preventDefault();
$(".layui-layer-btn0").click();
);
);
//登录成功,刷新页面
else
layer.alert(data.msg,
success: function()
//回车能关闭
$(document).on('keydown', function(e)
if(event.keyCode == 13)
e.preventDefault();
$(".layui-layer-btn0").click();
window.location.reload();
);
,
//点击确定也能跳转(没有这个。点击确定,不会跳转。。需要注意下)
yes:function()
window.location.reload();
)
)
)
</script>
以上是关于登录使用layer插件, 回车无限弹框bug解决的主要内容,如果未能解决你的问题,请参考以下文章