jquery点击回车键实现登录效果并默认焦点的方法


Posted in jQuery onMarch 09, 2018

最近在做项目登录时,每次都需要点击登录按钮才可以进入相应的页面,给用户一个很不好的体验,所以我就添加使用回车键来实现登录。

方法:

<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") {//keyCode=13是回车键
$("#login_btn").click();
 }
}); 
});

最终效果图:

jquery点击回车键实现登录效果并默认焦点的方法

以上这篇jquery点击回车键实现登录效果并默认焦点的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery实现鼠标滑过预览图片大图效果的方法
Apr 26 jQuery
jQuery实现jQuery-form.js实现异步上传文件
Apr 28 jQuery
jQuery 表单序列化实例代码
Jun 11 jQuery
jQuery图片缩放插件smartZoom使用实例详解
Aug 25 jQuery
jquery写出PC端轮播图实例
Jan 26 jQuery
JQuery获取可视区尺寸和文档尺寸及制作悬浮菜单示例
May 14 jQuery
JQuery发送ajax请求时中文乱码问题解决
Nov 14 jQuery
jQuery实现颜色打字机的完整代码
Mar 19 jQuery
jquery html添加元素/删除元素操作实例详解
May 20 jQuery
如何基于jQuery实现五角星评分
Sep 02 jQuery
jQuery实现可以计算进制转换的计算器
Oct 19 jQuery
如何在vue 中引入使用jquery
Nov 10 jQuery
JQuery选中select组件被选中的值方法
Mar 08 #jQuery
jQuery+koa2实现简单的Ajax请求的示例
Mar 06 #jQuery
轻松搞定jQuery+JSONP跨域请求的解决方案
Mar 06 #jQuery
jQuery实现左右滑动的toggle方法
Mar 03 #jQuery
jquery radio 动态控制选中失效问题的解决方法
Feb 28 #jQuery
详解jQuery中的isPlainObject()使用方法
Feb 27 #jQuery
jQuery幻灯片插件owlcarousel参数说明中文文档
Feb 27 #jQuery
You might like
一个php作的文本留言本的例子(一)
2006/10/09 PHP
php 日期时间处理函数小结
2009/12/18 PHP
使用cookie实现统计访问者登陆次数
2013/06/08 PHP
php中动态调用函数的方法
2015/03/16 PHP
漂亮的widgets,支持换肤和后期开发新皮肤
2007/04/23 Javascript
默认让页面的第一个控件选中的javascript代码
2009/12/26 Javascript
JQuery扩展插件Validate—6 radio、checkbox、select的验证
2011/09/05 Javascript
关于jquery性能最佳实践的讨论,与求教
2012/03/30 Javascript
说说JSON和JSONP 也许你会豁然开朗
2012/09/02 Javascript
js格式化时间和js格式化时间戳示例
2014/02/10 Javascript
使用jquery实现IE下按backspace相当于返回操作
2014/03/18 Javascript
JavaScript实现点击按钮直接打印
2016/01/06 Javascript
快速掌握Node.js环境的安装与运行方法
2016/02/16 Javascript
Javascript中的数组常用方法解析
2016/06/17 Javascript
Vue.js第三天学习笔记(计算属性computed)
2016/12/01 Javascript
jquery dataview数据视图插件使用方法
2016/12/23 Javascript
微信小程序开发经验总结(推荐)
2017/01/11 Javascript
JavaScript中使用参数个数实现重载功能
2017/09/01 Javascript
node+koa2+mysql+bootstrap搭建一个前端论坛
2018/05/06 Javascript
vue子组件改变父组件传递的prop值通过sync实现数据双向绑定(DEMO)
2020/02/01 Javascript
Node.js中文件系统fs模块的使用及常用接口
2020/03/06 Javascript
[01:59]游戏“zheng”当时试玩会
2019/08/21 DOTA
Python基础教程之内置函数locals()和globals()用法分析
2018/03/16 Python
Python中文件的读取和写入操作
2018/04/27 Python
Python高级特性与几种函数的讲解
2019/03/08 Python
Pyqt清空某一个QTreeewidgetItem下的所有分支方法
2019/06/17 Python
django之使用celery-把耗时程序放到celery里面执行的方法
2019/07/12 Python
详解Python可视化神器Yellowbrick使用
2019/11/11 Python
python实现逢七拍腿小游戏的思路详解
2020/05/26 Python
英国最出名高街品牌:Forever Unique
2018/02/24 全球购物
编写一子程序,将一链表倒序,即使链表表尾变表头,表头变表尾
2016/02/10 面试题
俄语专业毕业生推荐信
2013/10/28 职场文书
公交公司毕业生求职信
2014/02/15 职场文书
社区服务活动小结
2014/07/08 职场文书
爱国教育主题班会
2015/08/14 职场文书
python 如何执行控制台命令与操作剪切板
2021/05/20 Python