如何使 <input> 标签多行？

Question

我想知道是否可以使用 CSS 或其他选项制作一个 <input> 外观像多行的标签（类似于 <TEXTAREA></TEXTAREA >），不幸的是我可以替换标签在我的网络应用程序中。

    <input id="uxMessage" validation="required" name="uxMessage" type="text" />

非常感谢

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

Answer 1

<input type="text" /> 永远只有一行；您不能使用 CSS 或 JavaScript 强制多行行为。您将需要使用 <textarea> 而不是 <input> 。

您可以使用 jQuery 及其 .replaceWith() 方法将目标 <input> 替换为 <textarea> 。然而，这有明显的警告，例如那些在没有启用 JavaScript 的情况下访问您的页面的人。

例子：

 <input id="uxMessage" validation="required" name="uxMessage" type="text" />

$("#uxMessage").replaceWith('<textarea id="uxMessage" name="uxMessage"></textarea>');

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

Answer 2

并非没有一些相当庞大的 Javascript，Textarea 是我所知道的唯一多行文本输入。

编辑

像这样的东西可能适用于 jQuery：

 var textArea = jQuery('<textarea />').attr({'id': 'uxMessage', 'name': 'uxMessage'});
jQuery('#uxMessage').replaceWith(textArea);

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