Javascript 如何防止光标跳转到固定列文本区域的下一行

我有一个包含以下HTML的文本区域

当用户输入文本时，我希望光标在一行中输入16个字符时停止移动，它不应该自动移动到下一行，只有当用户点击enter键时。此外，不可能超过6行

---

如何做到这一点？

要实现您想要的目标，没有简单的方法，需要大量的代码和输入检查。相反，您可以使用一个包装器和六个

input

元素，稍微设置它们的样式，然后将值收集到隐藏的输入中，例如realtime或表单验证器中。大概是这样的：

函数createTxtarea（父项，cols）{
//设置“textarea”的列
const inputs=parent.querySelectorAll（'input'）；
input.forEach（input=>input.setAttribute（'maxlength'，cols））；
//为Enter键和箭头向上/向下键添加侦听器
常数focusTo={
输入：（e）=>e.target.nextElementSibling，
ArrowDown（e）{返回这个。输入（e）；}，
箭头向上：（e）=>e.target.PreviousElement同级
};
parent.addEventListener（'keydown'，（e）=>{
const key=e.key；
if（聚焦类型[键]=“功能”）{
e、 预防默认值（）；
const prext=focusTo[key]（e）；
if（prext）prext.focus（）；
}
//如果需要，在此处收集值
});
}
createTxtarea（document.getElementById（'area1'），16）
.txtarea{
边框：1px实心#ccc；
填充：1px；
显示：内联块；
}
.TXT区域输入{
边界：无；
显示：块；
}

为什么不把六个
input type=text
元素堆成一个textarea..？@Teemu callmewhateyouwant我想当按下回车键时，光标不会跳到下一个输入字段。此外，我不希望从6个不同的字段收集输入。添加一个事件监听器，它检测输入，并关注下一个输入。ENTER检测和输入收集的代码比试图更改textarea元素的本机行为要简单得多。为你。我假设将值收集到一个隐藏的输入是微不足道的。@Teemu callmewhateyouwant谢谢演示，它已经接近我想要的了。对于用户体验来说，如果使用箭头键可以更改行，那将是非常棒的，但我相信这也可以由事件侦听器完成。我认为有一个更简单的解决方案，代码更少（例如，只需设置一个textarea属性），但如果没有，您的答案已经很好了。