一个提交按钮以后,用户如果按了键盘的回车键,默认情况下,就会提交这个表单了。这样对于用户输入各个表单项目,用户体验很不好,输入完一个项目,或者用鼠标选择下一个项目,或者用键盘的Tab键选中下一个项目。

二、问题要求:

1:如果当前处于焦点(也就是用户正在输入的那个文本框)不是最后一个输入框,那么按回车键时,将焦点转移到下一个输入框;

2:如果当前处于焦点(也就是用户正在输入的那个文本框)是最后一个输入框,那么按回车键时,将请用户确认后提交表单;

三、基本思路:

1:判断按键是否是回车建, 这个比较好办,用jQeury中的事件,就可以获取到当前按的键的值了,回车键的值是13,比较一下即可。

2:判断当前处于焦点的输入框是不是最后一个输入框。

  1. $(function() {
  2. $("form[name='contractForm'] input:text").keypress(function(e) {
  3. if (e.which == 13) {// 判断所按是否回车键
  4. var inputs = $("form[name='contractForm']").find(":text"); // 获取表单中的所有输入框
  5. var idx = inputs.index(this); // 获取当前焦点输入框所处的位置
  6. if (idx == inputs.length - 1) {// 判断是否是最后一个输入框
  7. if (confirm("最后一个输入框已经输入,是否提交?")) // 用户确认
  8. $("form[name='contractForm']").submit(); // 提交表单
  9. } else {
  10. inputs[idx + 1].focus(); // 设置焦点
  11. inputs[idx + 1].select(); // 选中文字
  12. }
  13. return false;// 取消默认的提交行为
  14. }
  15. });
  16. });

JQuery实现回车代替Tab键(按回车跳到下一栏)的更多相关文章

  1. [C#]Winform下回车或Tab键自动切换下一个控件焦点

    满足用户体验,在数据录入时,能在输入完一个信息后通过回车或Tab键自动的切换到下一个控件(字段). 在界面控件设计时,默认可以通过设置控件的TabIndex来实现.但在布局调整时或者是对输入的内容有选 ...

  2. 类似智能购票的demo--进入页面后默认焦点在第一个输入框,输入内容、回车、right时焦点自动跳到下一个,当跳到select时,下拉选项自动弹出,并且可以按上下键选择,选择完成后再跳到下一个。

    要实现的效果:进入页面后默认焦点在第一个输入框,输入内容.回车.right时焦点自动跳到下一个,当跳到select时,下拉选项自动弹出,并且可以按上下键选择,选择完成后再跳到下一个. PS:自己模拟的 ...

  3. C#按回车Enter使输入焦点自动跳到下一个TextBox的方法收集

    在录入界面中,用户往往需要按回车键时光标自动跳入下一个文本框,以方便录入操作.在C#中实现该功能有多种方法,以下是小编收集的不使用TAB键,而直接用回车键将光标转到下一个文本框的实现方法. 一.利用W ...

  4. Python去除文件中的空格、Tab键和回车

    def stripFile(oldFile, newFile): '''remove the space or Tab or enter in a file, and output a new fil ...

  5. linux下tab键在命令行情况下的强大

    tab自动补全命令,包括可以补全比较长的文件名,速度快的不是一点点

  6. unigui回车代替TAB

    unigui回车代替TAB 在业务系统中常常使用回车键(Enter)替代Tab键完成焦点跳转,在uniGUI下,可以不用代码,直接使用TUniForm的NavigateKeys进行设置: 其中Next ...

  7. 控制WinForm中Tab键的跳转

    一,需求 在Winform中,默认情况下,按下Tab键,光标会按照我们设定的TabIndex值从小到大进行跳转. 但如果用户要求按下Tab键跳转到特定的控件,这种要求还是很合理的,比如用户只想输入几个 ...

  8. [No000018F]Vim自动缩进配置、原理和tab键替换空格-Vim使用技巧(4)

    一.Vim缩进介绍 在没有设置Vim自动缩进的条件下,可以手动使用Vim命令对特定行进行缩进处理.在Vim插入模式下,按下 Tab 键时默认会输入一个制表符,可通过Vim配置项将 Tab 替换为空格, ...

  9. jquery 回车切换 tab功能

    挺有趣的,Jquery 回车切换tab功能的实现哦 <html> <head><!--jquery库.js--></head> <body> ...

随机推荐

  1. 第一百九十五天 how can I 坚持

    晚上回来又肚子疼,拉肚子,咋搞的呢. 小米.华为.感觉虽然现在华为有些许优势,哎,还是不说了,感觉小米手机信号好像有问题. 中午吃的刀削面好像不熟,其实,怎么说呢,像开面馆,做的面顾客都吃不完,很明显 ...

  2. [翻译]创建ASP.NET WebApi RESTful 服务(8)

    本章讨论创建安全的WebApi服务,到目前为止,我们实现的API都是基于未加密的HTTP协议,大家都知道在Web中传递身份信息必须通过HTTPS,接下来我们来实现这一过程. 使用HTTPS 其实可以通 ...

  3. hdu 1260 Tickets

    http://acm.hdu.edu.cn/showproblem.php?pid=1260 题目大意:n个人买票,每个人买票都花费时间,相邻的两个人可以一起买票以节约时间: 所以一个人可以自己买票也 ...

  4. 【LeetCode】 Subsets

    Given a set of distinct integers, S, return all possible subsets. Note: Elements in a subset must be ...

  5. Codeforces 444 C. DZY Loves Colors (线段树+剪枝)

    题目链接:http://codeforces.com/contest/444/problem/C 给定一个长度为n的序列,初始时ai=i,vali=0(1≤i≤n).有两种操作: 将区间[L,R]的值 ...

  6. 转载sublime text3中package Control

    Sublime Text 3 安装Package Control 原来Subl3安装Package Control很麻烦,现在简单的方法来了 一.简单的安装方法 使用Ctrl+`快捷键或者通过View ...

  7. 错误"因为数据库正在使用,所以无法获得对数据库的独占访问权"的解决方案

    今天在还原数据库的时候,提示"因为数据库正在使用,所以无法获得对数据库的独占访问权",无论我是重启数据库,还是重启计算机,都不能解决问题,多番尝试后,终于解决了该问题.现将引发该问 ...

  8. PL SQL笔记(三)

    loop then .. exit; end if; end loop; select to_char(sysdate, 'YYYY-MM-DD HH24:MI:SS') from dual; sel ...

  9. flash 定义主舞台窗口大小

    1:[SWF(width=100 height=100)] 写在主类上面2:设置stageScaleMode属性为false;

  10. 转载:div和flash层级关系问题

    转自:http://sin581.blog.163.com/blog/static/860578932012813112334404/     问题: ie下默认好像div层级没有flash层级高,也 ...