如何通过在文本区域中的当前行末尾按空格来转到下一行答案

【问题标题】：How to go to next line by pressing space at end of the current line in textarea如何通过在文本区域中的当前行末尾按空格来转到下一行
【发布时间】：2015-02-14 04:48:10
【问题描述】：

我的 textarea 设置了这两个相关的样式属性：

white-space: pre-wrap;
word-wrap: break-word;

我想要实现的功能是，当用户按下空格按钮足够多次以到达文本区域的右边缘时，我希望光标移动到下一行。

【问题讨论】：

如果已经在最后一行，怎么能转到下一行？行来自回报。
这是 chrome 中 textarea 的一种奇怪行为（也许其他浏览器也是如此）.. 当你在行尾时，你不能通过输入空格来换行。不知道为什么有人会想要那个，这听起来很愚蠢。
如果你想进入下一行，为什么不按[enter]呢？我只是想了解要求和限制
这样的应用会是什么？
刚刚测试过，带有 contenteditable 的 div 非常适合这个。它不会在表单中工作，你必须自己通过js提取文本。

标签： javascript html css

【解决方案1】：

我做了“用 JS 破解”...这很简单：

var keypress = function(event){
  var textarea = event.target;
  var content = textarea.value;
  var cols = textarea.cols + 1;
  if(content.length % cols === textarea.cols){ textarea.value += '\n'; }
}, textareas = document.getElementsByTagName('textarea');
for(var t = 0; t < textareas.length; t += 1){
  var textarea = textareas[t];
  textarea.addEventListener('keyup', keypress);
  textarea.addEventListener('keydown', keypress);
}

textarea {
  white-space: pre-wrap;
  word-wrap: break-word;
}

&lt;textarea cols="20" rows="10"&gt;&lt;/textarea&gt;

【讨论】：