给button按钮绑定Enter回车键
做完登录页面后,每次都得点登录,觉得用户体验不友好,很是不方便,所以想着像其他网站一样,给登录按钮绑定Enter回车键,从网上找见一个简单易懂的,分享给大家.同时也会附带自己实现登录功能的页面代码.
//这个登录方法中密码用MD5加了密,页面中引入jquery.md5.js(具体可以自行百度)
//点击登录
$("#btnLogin").click(function () {
var userName = $("#username").val();
var userPwd = $("#password").val();
userPwd = $.md5(userPwd);
var verify = $(".verifyInput").val();
if (verify != ""){
if (userName != "" && userPwd != "") {
$.ajax({
url: "/identify_exam/login/check",
type: "POST",
data: {
username: userName,
password: userPwd,
verifyInput: verify
},
dataType: "JSON",
success:function(data){
if (data.code == 200) {
const token = data.result;
window.sessionStorage.setItem('user_token',token);
window.sessionStorage.setItem('user_name',userName);
window.location.href = "/identify_exam/login/main";
} else if(data.code == 501) {
$.messager.alert('提示:',data.msg,'error');
}else if (data.code == 502) {
$.messager.alert('提示:',data.msg,'error');
}else if (data.code == 503){
$.messager.alert('提示:',data.msg,'warning');
}
if (data.code == 500){
$.messager.alert('提示消息',"系统异常!",'error');
}
}
});
} else {
$.messager.alert('提示:','用户名或密码不能为空!','warning');
}
}else {
$.messager.alert('提示:','验证码不能为空!','warning');
}
});
//给登录按钮绑定回车键
$("body").keydown(function () {
if (event.keyCode == "13"){ //13是enter键的键码
$("#btnLogin").click();
//调用登录方法,在div中定义方法,或通过js绑定的方法都可以,我的登录方法就是通过jquery绑定的点击事件
}
});
因为这篇文章主要是写如何给button按钮添加Enter回车键,所以其他内容就省略了,如有需要可以评论或私信,有时间我会发出来,有写的不对的地方,还望大家及时指正.谢谢大家的观看 ^ _ ^ !