js怎么获取inpu焦点，输入完1位数字后自动跳到第二个input，如此类推到第6个完成
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js怎么获取inpu焦点，输入完1位数字后自动跳到第二个input，如此类推到第6个完成相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
RunJS 演示代码
</title>
<style>
*
margin:0;
padding:0;
#wrap
margin:auto;
width: 300px;
#wrap input[type=text]
width:30px;
height:20px;
float:left;
text-align:center;
</style>
<script>
onload = function()
var txts = wrap.getElementsByTagName("input");
for(var i = 0; i<txts.length;i++)
var t = txts[i];
t.index = i;
t.setAttribute("readonly", true);
t.onkeyup=function()
this.value=this.value.replace(/^(.).*$/,'$1');
var next = this.index + 1;
if(next > txts.length - 1) return;
txts[next].removeAttribute("readonly");
txts[next].focus();
txts[0].removeAttribute("readonly");
</script>
</head>
<body>
<div id="wrap">
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
</div>
</body>
</html> 参考技术A 这个用的是div吧？当点击了密码栏，开始监听。
然后监听keydown事件，每输入一个，就把数字写进去。
js input框输入1位数字后自动跳到下一个input框聚焦
// input框输入1位数字后自动跳到下一个input聚焦 function goNextInput(el){ var txts = document.querySelectorAll(el); for(var i = 0; i<txts.length;i++){ var t = txts[i]; t.index = i; t.setAttribute("readonly", true); t.onkeyup=function(){ this.value=this.value.replace(/^(.).*$/,‘$1‘); var next = this.index + 1; if(next > txts.length - 1) return; txts[next].removeAttribute("readonly"); if (this.value) { txts[next].focus(); } } } txts[0].removeAttribute("readonly"); }
调用如下：goNextInput(‘.code-num‘);
以上是关于js怎么获取inpu焦点，输入完1位数字后自动跳到第二个input，如此类推到第6个完成的主要内容，如果未能解决你的问题，请参考以下文章
怎样解决系统导出的excel表中18位数字后3位自动变为0的问题