当达到输入长度时表单自动切换焦点

复制代码 代码如下:

<form>
<input type="text" maxlength="3">-
<input type="text" maxlength="3">-
<input type="text" maxlength="4">
<br>
<input type="submit" value="Submit">
</form>

复制代码 代码如下:

(function () {
function tabForward(e) {
e = e || window.event;
var target = e.target || e.srcElement;

if (target.value.length === target.maxLength) {
var form = target.form;

for (var i = 0, len = form.elements.length; i < len; i++) {
if (form.elements[i] === target) {
if (form.elements[i++]) {
form.elements[i++].focus();
}
break;
}
}
}
}

var textbox1 = document.getElementById("txt1");
var textbox2 = document.getElementById("txt2");
var textbox3 = document.getElementById("txt3");

textbox1.addEventListener("keyup", tabForward, false);
textbox2.addEventListener("keyup", tabForward, false);
textbox3.addEventListener("keyup", tabForward, false);

})();

复制代码 代码如下:

var form = document.getElementById("myForm");
var textbox1 = form.elements[0];
var textbox2 = form.elements["tel2"];

复制代码 代码如下:

var textbox1 = document.getElementById("txt1");
var textbox2 = document.getElementById("txt2");
var textbox3 = document.getElementById("txt3");

textbox1.addEventListener("keyup", tabForward, false);
textbox2.addEventListener("keyup", tabForward, false);
textbox3.addEventListener("keyup", tabForward, false);

复制代码 代码如下:

var form = document.getElementById("myForm");
form.addEventListener("keyup", tabForward, false);