- 浏览: 6381904 次
- 性别:
- 来自: 一片神奇的土地
-
文章分类
- 全部博客 (745)
- JQuery (25)
- JS (33)
- 数据库 (59)
- Java基础 (56)
- JSON (8)
- XML (8)
- ireport (7)
- 设计模式 (10)
- 心情 (14)
- freemarker (1)
- 问题 (15)
- powerdesigner (2)
- CSS (15)
- DWR (4)
- tomcat (16)
- Hibernate (12)
- Oracle (7)
- Struts (7)
- Spring (34)
- JSP (23)
- 需学习 (64)
- 工具类库 (63)
- Maven (14)
- 笔试题 (34)
- 源码学习 (31)
- 多线程 (39)
- Android (32)
- 缓存 (20)
- SpringMVC (14)
- jQueryEasyUi (12)
- webservice-RPC (13)
- ant (1)
- ASP.NET (10)
- 正则表达式 (3)
- Linux (15)
- JBoss (1)
- EJB (3)
- UML (2)
- JMS (3)
- Flex (8)
- JSTL (2)
- 批处理 (5)
- JVM (16)
- 【工具】 (16)
- 数据结构 (29)
- HTTP/TCP/Socket (18)
- 微信 (1)
- tomcat源码学习 (15)
- Python (30)
- 主机 (2)
- 设计与架构 (19)
- thrift-RPC (2)
- nginx (6)
- 微信小程序 (0)
- 分布式+集群 (12)
- IO (1)
- 消息队列 (4)
- 存储过程 (8)
- redis (9)
- zookeeper (5)
- 海量数据 (5)
最新评论
-
360pluse:
技术更新,战术升级!Python爬虫案例实战从零开始一站通网盘 ...
Python爬虫实战:Scrapy豆瓣电影爬取 -
18335864773:
推荐用 pageoffice 组件生成 word 文件。
JAVA生成WORD工具类 -
jjhe369:
LISTD_ONE 写道起始地址为163.135.0.1 结束 ...
IP地址与CIDR -
baojunhu99:
private final int POOL_SIZE = 5 ...
使用CompletionService获取多线程返回值 -
LovingBaby:
胡说,javascript 运行时是单线程的,event lo ...
Ajax请求是否可以实现同步
总结:
获取表单中的所有输入框inputs,通过inputs.index(this)获取当前焦点输入框所处的位置idx,不是最后一个输入框时为下一个输入框设置焦点。
原文链接:http://www.popo4j.com/article/JQuery-to-achieve-Enter-key-instead-of-Tab.html
对于一个网页上的表单,放置了一个提交按钮以后,用户如果按了键盘的回车键,默认情况下,就会提交这个表单了。这样对于用户输入各个表单项目,用户体验很不好,输入完一个项目,或者用鼠标选择下一个项目,或者用键盘的Tab键选中下一个项目。
二、问题要求:
1:如果当前处于焦点(也就是用户正在输入的那个文本框)不是最后一个输入框,那么按回车键时,将焦点转移到下一个输入框;
2:如果当前处于焦点(也就是用户正在输入的那个文本框)是最后一个输入框,那么按回车键时,将请用户确认后提交表单;
1:如果当前处于焦点(也就是用户正在输入的那个文本框)不是最后一个输入框,那么按回车键时,将焦点转移到下一个输入框;
2:如果当前处于焦点(也就是用户正在输入的那个文本框)是最后一个输入框,那么按回车键时,将请用户确认后提交表单;
三、基本思路:
1:判断按键是否是回车建, 这个比较好办,用jQeury中的事件,就可以获取到当前按的键的值了,回车键的值是13,比较一下即可。
2:判断当前处于焦点的输入框是不是最后一个输入框。
1:判断按键是否是回车建, 这个比较好办,用jQeury中的事件,就可以获取到当前按的键的值了,回车键的值是13,比较一下即可。
2:判断当前处于焦点的输入框是不是最后一个输入框。
$(function() { $("form[name='articleForm'] input:text").keypress(function(e) { if (e.which == 13) // 判断所按是否回车键 { var inputs = $("form[name='articleForm']").find(":text"); // 获取表单中的所有输入框 var idx = inputs.index(this); // 获取当前焦点输入框所处的位置 if (idx == inputs.length - 1) // 判断是否是最后一个输入框 { if (confirm("最后一个输入框已经输入,是否提交?")) // 用户确认 $("form[name='articleForm']").submit(); // 提交表单 } else { inputs[idx + 1].focus(); // 设置焦点 inputs[idx + 1].select(); // 选中文字 } return false;// 取消默认的提交行为 } }); });
1
发表评论
-
抢购学习
2019-03-01 10:53 1057来源:https://blog.csdn.net/lius ... -
JSONP跨域
2019-02-26 11:31 1028jQuery jsonp跨域请求(很详细) json和j ... -
Ajax请求是否可以实现同步
2018-06-14 10:32 5371Ajax请求是否可以实现同步 当JS代码加载到当前A ... -
jQuery新特性总结
2017-09-18 16:00 937$(document).on: 从jQuery1.7开始 ... -
jQuery中map函数
2017-04-06 10:13 1264两种方式: 1、直接jQuery.map //将原数组中 ... -
JS实现的刮刮卡程序
2017-01-05 11:38 2930来源: 基于HTML5 Canvas的刮奖(刮刮卡)小控 ... -
Google插件
2016-06-29 11:56 1453Chrome插件下载 吐血推荐珍藏的Chrome插件 ... -
移动端图片上传解决方案localResizeIMG先压缩后ajax无刷新上传
2016-03-10 09:46 11049现在科技太发达,移动设备像素越来越高,随便一张照片2M+, ... -
使用megapixImage.js定位并展示上传的图片
2016-03-09 18:10 3618megapix-image插件 使用Canvas压缩图片上 ... -
基于jquery实现日历签到功能
2016-02-23 14:05 17770使用Jquery实现每日签到功能 基于jquery实现日 ... -
加载更多
2015-02-05 14:59 3545加载更多: 默认展示第一页数据,向下滑动加载第二页数据,依 ... -
Jquery表单验证插件–Validform
2015-02-05 11:44 20219Validform: Jquery表单验证插件–Valid ... -
EasyUI项目中的自定义JS
2014-07-09 17:15 4988自定义方法: (function($) { ... -
jquery.cookie.js使用介绍
2013-12-30 10:58 2421对cookies的操作在当访问一个网站就无时无刻的都伴随着我 ... -
Jquery打造可以上下移动行的表格
2013-05-06 16:05 3711current.insertBefore(prev); c ... -
[转]JQuery语法总结和注意事项
2011-12-03 13:09 18021、关于页面元素的引用 通过jquery的 $() ... -
jQuery的自动完成插件autocomplete
2011-05-17 14:17 13837autocomplete方法有两个参数,第一个用来填写URL地 ... -
jQuery实现Select多选列表双击选中项时相互添加
2011-05-13 11:45 8976jQuery实现在左边双击某一项时添加到右边,右边时添加到左边 ... -
$.ajax中dataType为html实现地区显示效果
2010-12-23 17:00 12216实现了选择第一个时,第二个才显示,并且显示的是对应的信息 ... -
Jquery中的验证jquery.validate.js
2010-12-06 20:03 3481默认验证信息是英文,要改成中文,需引入如下js:jquery. ...
相关推荐
通常,用户通过按Tab键在表单元素之间进行切换,但有时我们可能希望用户通过按下回车键来实现这种切换,这样可以提供更友好的交互体验,尤其是对于那些习惯于使用回车键进行确认操作的用户。然而,需要注意的是,这...
第一种方法: 代码如下: $(document).ready(function () { $(‘:input:text:first’).focus(); $(‘:input:enabled’).addClass(‘enterIndex’); // get only input tags with class data-entry textboxes = $(‘....
3.16 用回车键模拟Tab键 第4章 jQuery操作CSS样式 4.1 使用addClass()函数动态添加样式类 4.2 使用removeClass()函数动态移除样式类 4.3 使用toggleClass()函数切换页面元素的样式类 4.4 为body增加class类...
在本实例中,我们将深入...这个实例对于理解jQuery在网页交互中的应用非常有帮助,同时也提供了实现可编辑表格的一种实用方法。通过类似的方法,开发者可以扩展这个功能,比如添加验证、错误提示、保存数据到服务器等。
此处`event.keyCode == 13`检测回车键,将其替换为`Tab`键(`keyCode = 9`),从而实现回车键的重定向。 ### 5. 限制输入框只能输入数字 可以利用正则表达式来限制输入框内的内容只能包含数字。例如: ```html (/[^...
- **定义**: 当用户按下回车键时自动触发Tab键的效果。 - **实现方法**: JavaScript监听键盘事件并替换按键行为。 #### 11. DataGrid 超级连接列 - **定义**: 在DataGrid控件中使用超级链接作为一列的数据显示方式...
### ASP.NET 开发常用知识点汇总 #### 一、ASP.NET 页面内传参数方法 1. **使用QueryString** - **优点**: - 使用简单,适用于安全性要求不高的场景,如传递数字或文本值。 - **缺点**: ...
当用户离开单元格(失去焦点)或按下回车键时,新的内容会替换原有单元格的文本,并恢复单元格的点击事件。 `addtr` 函数则用于在表格底部添加新的行,允许用户继续添加新的键值对。注意,这里的行数限制(8 行)...
特殊字符包括但不限于以下几种:单引号('),双引号("),和号(&),反斜杠(\),换行符(\n),回车符(\r),制表符(\t),退格符(\b),以及换页符(\f)。这些特殊字符如果直接添加到字符串中,可能会导致...