本文摘自PHP中文网,作者php中世界最好的语言,侵删。
这次给大家带来如何实现jquery回车登录效果,实现jquery回车登录效果的注意事项有哪些,下面就是实战案例,一起来看一下。最近在做项目登录时,每次都需要点击登录按钮才可以进入相应的页面,给用户一个很不好的体验,所以我就添加使用回车键来实现登录。
方法:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <form>
<input type= "text" id= "username_txt" placeholder= "用户名" />
<input type= "password" id= "userpass_txt" placeholder= "密码" />
<button id= "login_btn" >登录</button>
</form>
$( function () {
$( '#username_txt' ).focus();
$( "#login_btn" ).click( function () {
var username = $( '#username_txt' ).val();
var userpass = $( '#userpass_txt' ).val();
if (username == "" || userpass == "" ) { alert( "用户名密码不能为空!" '); }
else {
$.ajax({
});
}
});
$( "body" ).keydown( function (event) {
if (event.keyCode == "13" ) {
$( "#login_btn" ).click();
}
});
});
|
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
使用DOM的一些小结
怎样做出京东商品详情的放大镜效果
以上就是如何实现jquery回车登录效果的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
jQuery 怎么判断指定样式是否存在
html怎么删除表格的第二行
如何解决jQuery参数乱码问题
jQuery如何给p标签赋值
jQuery字母大小写转换函数有哪些
bootstrap 5 alpha发布啦!不再依赖jQuery,放弃支持ie
jQuery怎么判断值为空
用jQuery如何获取类名
jQuery选择器有什么优点?
jQuery怎么设置disabled属性?
更多相关阅读请进入《jQuery》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » 如何实现jquery回车登录效果