javascript - 组合多个文本输入框的

Question

所以我有 3 个文本输入区域。这样做的原因是我需要用黑线分隔每行文本。

我需要想办法让这些文本框看起来像一个巨大的文本区域。

即- 当您键入时，如果没有剩余空间，它会移至下一行；当您删除文本时，它会根据需要将其推回到上一行。

有谁知道我可以实现此目标的任何解决方法或方法吗？

---

我基本上需要制作一个人们可以输入的框，看起来与图片完全一样，但人们只能在蓝色区域输入和编辑。文本“人们将键入的内容的标签”。不能更改、编辑、删除等。

Answer 1

您可以像这样使用纯 javascript:

<script type="text/javascript">
function ValidatePassKey(tb) {
  if (tb.TextLength >= 4)
    document.getElementById(tb.id + 1).focus();
  }
  if (tb.TextLength == 0 & tb.id !== 1){
       document.getElementById(tb.id - 1).focus();
  }
}
</script>

<input id="1" type="text" onchange="ValidatePassKey(this)" maxlength="4">
<input id="2" type="text" onchange="ValidatePassKey(this)" maxlength="4">
<input id="3" type="text" onchange="ValidatePassKey(this)" maxlength="4">
<input id="4" type="text" maxlength="4">

一旦您当前所在的文本框变满，这只会将您的光标移动到下一个文本框。