在 input type="text" 元素 HTML/CSS 中包装文本

Question

如下所示的 HTML，

 <input type="text"/>

在浏览器中显示如下：

---

当我添加以下文本时，

敏捷的棕色狐狸跳过了懒惰的狗。

使用下面的 HTML，

 <input type="text" value="The quick brown fox jumped over the lazy dog."/>

它显示在浏览器中，如下所示：

---

但我希望它像这样显示在浏览器中：

---

我希望输入元素中的文本换行。这可以在没有文本区域的情况下完成吗？

原文由 Web_Designer 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

那就是 textarea 的工作 - 用于多行文本输入。 input 不会这样做；它不是为此而设计的。

所以使用 textarea 。除了它们的视觉差异外，它们通过 JavaScript 以相同的方式访问（使用 value 属性）。

您可以防止通过 input 事件输入换行符，并且只需使用 replace(/\n/g, '') 。

原文由 alex 发布，翻译遵循 CC BY-SA 3.0 许可协议