window.onload = function () {
//阻止按回车按钮后提交表单的问题
document.getElementsByTagName("form")[0].onkeydown = function () {
if (event.keyCode == 13) { return false; }
};
var inputs = document.getElementsByTagName("input");
var index = 1;
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].type == "text" && inputs[i].style.display != "none" && inputs[i].getAttribute("disabled") != "disabled") {
//给页面上的没有隐藏的文本框设置tabindex顺序值,下文按tabindex顺序跳转
inputs[i].setAttribute("tabindex", index);
//监听onkeydown事件,输入回车时实现跳至下一文本框
inputs[i].onkeydown = goNextInput;
index++;
}
}
}; function goNextInput() {
if (window.event.keyCode == 13) { //录入回车时才往下一录入框跳
//下一个录入框的tabindex值
var nextIndex = parseInt(window.event.srcElement.getAttribute("tabindex")) + 1;
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].type == "text" && inputs[i].style.display != "none") {
var tabIndex = inputs[i].getAttribute("tabindex");
if (tabIndex != null) {
var index = parseInt(tabIndex);
if (typeof index == "number" && !isNaN(index) && index == nextIndex) {
inputs[i].focus();
}
}
}
}
}
}

html页面实现回车跳转下一文本框的更多相关文章

  1. 微信内置浏览器浏览H5页面弹出的键盘遮盖文本框的解决办法(转)

    最近在做微信公众号的内嵌页面,发现点击输入框时键盘盖住文本框,找到一段代码解决了这个问题. iOS和android手机都已亲测,需要的可以直接拷贝到代码中使用. js代码如下: $(function ...

  2. Silverlight中文本框添加回车事件后,换行无法清除的解决方法

    在开发Silverlight的项目中,为了更好的用户体验,我们常要给一些控件添加一些快捷键.然而,在Silverlight中当用户回车提交后,光标停留在文本框的第二行怎么也清除不掉,经过一段时间研究, ...

  3. ie下使用文本编辑器导致input文本框无法聚焦的问题原因

    最近公司的一个项目遇到一个如下问题: 描述:测试发现,每当我们在发布活动的页面发布完活动后,页面跳转到我的活动,然后再次回到发布活动页面,发现所有的input文本框都不能聚焦.然后再去看看其他页面(我 ...

  4. 如何去掉IE文本框后的那个X css代码

    在IE10以上版本中,页面上的文本框控件在输入文字时候会被自动加上一个X.但是IE这个自作聪明的功能有时候会让我们的页面爆掉,比如当文本框宽度过小,X显示不下时候会顶掉你的文本. 要隐藏这个X可以用I ...

  5. [转]让你的网页文本框增加光晕效果与提示,水印(类似QQ2011)

    本文转自:http://www.cnblogs.com/xiaofengfeng/archive/2013/01/28/2880344.html 让你的网页文本框增加光晕效果(类似QQ2011) 我们 ...

  6. tp5页面输出时,搜索后跳转下一页的处理

    tp5页面输出时,搜索功能在跳转下一页时,如果不做任何处理,会返回原有是第二页输出的数据.为了保证跳转下一页时输出的是搜索到的数据,做以下处理. (要根据自己的搜索字段进行适当修改) 页面js代码,给 ...

  7. 使用 elementUI 的表单进行查询,表单中只有一个文本框时,回车会自动触发表单的提交事件,导致页面的刷新。

    使用elementUI的el-form组件进行查询时,当输入框仅有一项时,回车自动提交表单,浏览器会刷新页面: 原因:由于当表单只有一个文本框时,按下回车将会触发表单的提交事件, 从而导致页面刷新. ...

  8. App单个页面的最佳文本框个数是多少个?

    [1].不同大小的手机屏幕,对应的App每页最佳文本框个数,是不同的. [1.1]如果是iPhone4的屏幕尺寸,分辨率为640x960px的时候, 文本框个数最大值为:2个文本框 [计算公式] 第 ...

  9. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

  10. SAP四代增强实现:销售订单复制项目文本时不需要显示文本框和回车

    最近接收到一个业务需求,在SAP依据销售订单复制时,如果订单里面的项目有多个文本,系统就会显示复制的文本框处理,让用户选择是否复制,这个就让销售很不舒服,如果有几十个项目,每个项目有几个文本,那就就要 ...

随机推荐

  1. 再探 游戏 《 2048 》 —— AI方法—— 缘起、缘灭(6) —— Python版本实现的《2048》游戏环境运行性能对比

    <2048>游戏在线试玩地址: https://play2048.co/ 如何解决<2048>游戏源于外网的一个讨论帖子,而这个帖子则是讨论如何解决该游戏的最早开始,可谓是&q ...

  2. grpc断路器之sentinel 荐

    背景 为了防止下游服务雪崩,这里考虑使用断路器 技术选型 由于是springboot服务且集成了istio,这里考虑三种方案 istio hystrix sentinel 这里分别有这几种方案的对比 ...

  3. maven依赖拉取小技巧

    依赖对应的dependency搜索库 https://mvnrepository.com/ 前往搜索  点击对应的依赖版本复制xml的代码  然后idea中刷新maven即可拉出来

  4. C++ : 仅添加一个引用& 就直接导致程序崩溃

    问题描述 在项目某次开发中,测试过程中出现了coredump问题.经过asan工具检测,报了heap-use-after-free内存错误,最终定位到竟是无意中添加了一个引用&导致的! 开发时 ...

  5. JS 希尔排序完全理解

    希尔排序的思想直白点来说就是间隔对比,比如说 我有一个数组,长度为9,则第一次分割间隔为长度的1/3 + 1,则第一次对比就是1 比 4,2 比 5, 3 比 6,4 比 7,5 比 8 , 6 比 ...

  6. CSS – vw, vh, position fixed and ICB (initial containing block)

    什么是 vw, vh? vh 的 v 指的是 viewport, h 就是 height. 它是 CSS 值的单位就像 px, %. .container { height: 30vh; backgr ...

  7. Spring —— (Spring管理第三方资源)数据源对象管理

    数据源对象管理      (用户名密码等敏感的数据不会直接放在bean中 而是放在properties文件中进行管理)    加载properties文件      在resource中创建 jdbc ...

  8. Spring —— 依赖自动装配

    依赖自动装配   IoC容器根据bean所依赖的资源在容器中自动查找并注入到bean中的过程称为自动装配 自动装配方式 按类型(常用) 按名称 按构造方法 不启用自动装配    注意: 自动装配用于引 ...

  9. 一,初始 MyBatis-Plus

    一,初始 MyBatis-Plus @ 目录 一,初始 MyBatis-Plus 1. MyBatis-Plus 的概述 2. 入门配置第一个 MyBatis-Plus 案例 3. 补充说明: 3.1 ...

  10. 【赵渝强老师】Kubernetes平台中日志收集方案

    一.K8s整体日志收集方案 整体的日志收集方案,如下图所示: Filebeat是本地文件的日志数据采集器,可监控日志目录或特定日志文件(tail file),并将它们转发给Elasticsearch或 ...