jQuery回车键快速切换下一个input文本框解决方案
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>enter</title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.js"></script>
</head>
<body>
<div onkeyup="onEnter()">
<input type="text" name="input" onclick="clickEnter()">
<input type="text" name="input" onclick="clickEnter()">
<input type="text" name="input" onclick="clickEnter()">
<input type="text" name="input" onclick="clickEnter()">
<input type="text" name="input" onclick="clickEnter()">
<input type="text" name="input" onclick="clickEnter()">
<input type="text" name="input" >
</div>
<script>
var index = 0
<!-- function clickEnter() {
$('input[name=input]').each(function (i) {
if ($(this).is(':focus')) {
index = i
}
})
}
-->
function onEnter() {
if (event.keyCode == 13){
index++
if (index >= $('input[name=input]').length) {
index = 0
}
$('input[name=input]').each(function (i) {
if (i == index) {
$(this).focus()
}
})
}
}
</script>
</body>
</html>jQuery回车键快速切换下一个input文本框解决方案的更多相关文章
- 如何使一个input文本框随其中内容而变化长度（转）
第一: <input type="text" onkeydown="this.onkeyup();" onkeyup="this.size=(t ...
- 如何使一个input文本框随其中内容而变化长度。
第一:<input type="text" onkeydown="this.onkeyup();" onkeyup="this.size=(th ...
- input文本框的value属性在页面中不随输入的数据而变化
今天,在做试验遇到这么一个需求: 一个input文本框,输入值后将标签传到后台,在后台解析标签,发现value仍然是初值,不是我们改变后的值. 例如: <input name="&qu ...
- 解决Chrome浏览器自动记录用户名和密码的黄色背景问题和该解决方法与tab切换至下一个input冲突的问题。
哈哈哈,是不是标题很长呀,不逗你们了.其实这么长的标题主要就说了两件事: 第一件:解决Chrome浏览器自动记录用户名和密码的黄色背景问题. 第二件:输入完用户名后按下tab键切换至下一个输入密码in ...
- ie下使用文本编辑器导致input文本框无法聚焦的问题原因
最近公司的一个项目遇到一个如下问题: 描述:测试发现,每当我们在发布活动的页面发布完活动后,页面跳转到我的活动,然后再次回到发布活动页面,发现所有的input文本框都不能聚焦.然后再去看看其他页面(我 ...
- chrome下input文本框自动填充背景问题解决
chrome下input文本框会自动填充背景,只需要给文本框加一个样式即可解决问题 input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px ...
- 验证码输入自动聚焦下一个input或者删除自动聚焦上一个input
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- js input框输入1位数字后自动跳到下一个input框聚焦
// input框输入1位数字后自动跳到下一个input聚焦 function goNextInput(el){ var txts = document.querySelectorAll(el); f ...
- 我的插件のinput文本框实现宽度自适应
先来最后结果:DEMO 介绍一下如何让一个文本框的宽度能够随着文本框中的内容的宽度增长而增长,也就是能够实现宽度自适应效果. 代码实例如下: <!DOCTYPE html> <htm ...
随机推荐
- 浅析Android View（二）
深入理解Android View(一) View的位置參数信息 二.View的绘制过程 View的绘制过程一共分为三个部分: - measure(測量View的大小) - layout(确定View的 ...
- Vi文本编辑
vi 有3种工作模式,分别是命令行模式.插入模式.底行模式 . 命令行模式:最初进入的一般模式,该模式下可以移动光标进行浏览,整行删除,但无法编辑文字.插入模式:只有在该模式下,用户才能进行文字的编辑 ...
- Linux-vim与ssh客户端
一.vim使用 Linux系统下标准的编辑器,他就相当于windows系统中的记事本一样,它的强大不逊色于任何最新的文本编辑器. (1)vim安装 (2)vim使用:操作模式 一般模式(默认模式,不 ...
- HTTPS复习
Https Https其实是两个协议,即HTTP协议和SSL协议,但是由于HTTP协议应用广泛,而且需要为其提供数据隐私保护,所以将HTTP协议与SSL协议结合.HTTP属于应用层,在远古时代,它只需 ...
- $ 一步一步学Matlab（2）——Matlab基本通用操作
在上一篇中对Matlab做了一个初步的了解,本文继续来零距离亲身体验Matlab,来感受一下Matlab的一些基本.通用的操作. 命令行窗口 一打开Matlab就能看到命令行窗口,在我所用的这个精简版 ...
- hTML5 多图上传预览
<p> <label>请选择一个文件:</label> <input type="file" id="file" mu ...
- 20145302张薇《Java程序设计》实验一报告
20145302 <Java程序设计>实验一:Java开发环境的熟悉 实验内容 使用dos命令行编译.运行简单的Java程序: 使用IDEA编辑.编译.运行.调试Java程序. 1.命令行 ...
- 20145327实验二Java面向对象程序设计
Java面向对象程序设计 实验内容 初步掌握单元测试和TDD 理解并掌握面向对象三要素:封装.继承.多态 初步掌握UML建模 熟悉S.O.L.I.D原则 了解设计模式 伪代码,产品代码,测试代码的应用 ...
- python爬虫之新浪微博登录
fiddler 之前了解了一些常见到的反爬措施,JS加密算是比较困难,而微博的登录中正是用JS加密来反爬,今天来了解一下. 分析过程 首先我们去抓包,从登录到微博首页加载出来的过程.我们重点关注一下登 ...
- 4196: [Noi2015]软件包管理器
Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 412 Solved: 251[Submit][Status][Discuss] Descriptio ...