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中fade(),show()起始位置的一点小发现
Apr 25 jQuery
bootstrap+jQuery实现的动态进度条功能示例
May 25 jQuery
jquery图片放大镜效果
Jun 23 jQuery
利用jQuery异步上传文件的插件用法详解
Jul 19 jQuery
jquery实现下拉菜单的手风琴效果
Jul 23 jQuery
判断jQuery是否加载完成,没完成继续判断的解决方法
Dec 06 jQuery
jquery 输入框查找关键字并提亮颜色的实例代码
Jan 23 jQuery
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
Apr 12 jQuery
jQuery实现的滑块滑动导航效果示例
Jun 04 jQuery
jquery.param()实现数组或对象的序列化方法
Oct 08 jQuery
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
Feb 04 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 ADODB使用方法集锦
2008/03/25 PHP
php 动态添加记录
2009/03/10 PHP
PHP开发中常用的字符串操作函数
2011/02/08 PHP
php 启动时报错的简单解决方法
2014/01/27 PHP
php检查字符串中是否包含7位GSM字符的方法
2015/03/17 PHP
php制作基于xml的RSS订阅源功能示例
2017/02/08 PHP
php usort 使用用户自定义的比较函数对二维数组中的值进行排序
2017/05/02 PHP
JavaScript继承方式实例
2010/10/29 Javascript
JavaScript.The.Good.Parts阅读笔记(二)作用域&amp;闭包&amp;减缓全局空间污染
2010/11/16 Javascript
Javascript代码在页面加载时的执行顺序介绍
2013/05/03 Javascript
IE6下javasc#ipt:void(0) 无效的解决方法
2013/12/23 Javascript
javascript轻量级模板引擎juicer使用指南
2014/06/22 Javascript
一看就懂:jsonp详解
2015/06/01 Javascript
nodeJs爬虫获取数据简单实现代码
2016/03/29 NodeJs
JS实现页面中所有img对象添加onclick事件及新窗口查看图片的方法
2016/12/27 Javascript
vue cli3 配置proxy代理无效的解决
2019/10/30 Javascript
Python的time模块中的常用方法整理
2015/06/18 Python
Python自动化运维和部署项目工具Fabric使用实例
2016/09/18 Python
numpy使用技巧之数组过滤实例代码
2018/02/03 Python
Python3 log10()函数简单用法
2019/02/19 Python
python pandas写入excel文件的方法示例
2019/06/25 Python
python中while和for的区别总结
2019/06/28 Python
Django实现跨域的2种方法
2019/07/31 Python
Python使用matplotlib绘制Logistic曲线操作示例
2019/11/28 Python
PyCharm2020最新激活码+激活码补丁(亲测最新版PyCharm2020.2激活成功)
2020/11/25 Python
html5启动原生APP总结
2020/07/03 HTML / CSS
AmazeUi Tree(树形结构) 应用小结
2020/08/17 HTML / CSS
英国女性时尚精品店:THE DRESSING ROOM
2018/05/23 全球购物
生物医学工程专业学生求职信范文分享
2013/12/14 职场文书
《从现在开始》教学反思
2014/04/15 职场文书
行政秘书工作自我鉴定
2014/09/15 职场文书
秋季校运会广播稿100字
2014/09/18 职场文书
2016幼儿教师自荐信范文
2016/01/28 职场文书
《山中访友》教学反思
2016/02/24 职场文书
使用logback实现按自己的需求打印日志到自定义的文件里
2021/08/30 Java/Android
【海涛dota解说】DCG联赛第一周 LGD VS DH
2022/04/01 DOTA