html部分:
<div id="box">
<input type="text" autofocus>
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
</div>
js部分:
<script>
let inputs = document.querySelectorAll("input");//获取全部input输入框
for (const i of inputs) {
i.oninput = checkCode //为全部input添加事件
}
var elt;
function checkCode(e) {
elt = e.target.nextElementSibling; //获取当前事件源的下一个兄弟元素
if (elt)
elt.focus(); //下一个兄弟元素存在,下一个兄弟元素获取焦点
if (box.lastElementChild.value !== '')
box.lastElementChild.blur() //下一个兄弟元素不存在则失焦
}
window.onkeydown = function (e) {
if (e.keyCode === 8) { //键盘删除按键触发
var del = (elt == null ? box.lastElementChild : elt.previousElementSibling); //如当前为失焦状态,则默认选择最后一个元素,否则选择上一个兄弟元素
if (del == null) return //第一个的上一个兄弟元素为空则return,
del.value = '';
del.focus()
elt=del
}
}
</script>
