使用contentEditable div而不是textarea有什么缺点？

Question

我是否会通过使用具有属性contentEditable="true"作为文本字段而不是文本区域的div来拍摄自己的脚？

Answer 1

它会工作正常,但它比表单更难一点,因为你将不得不连接自己的逻辑,使按钮的点击事件跟踪正确的div,获取其内容,以及然后执行提交.textarea的优势在于浏览器会为您完成所有这些工作.

Answer 2

的Gmail邮件编辑框也是一个divwith contenteditable="true"。主要好处是它可以根据用户输入文本/内容自动调整高度。它还支持内部富文本。Textarea如果需要，您可以通过设置最大高度来模仿。

另一方面，如果您想要自动高度Textarea，您可能必须使用 js 将一些侦听器绑定到钩子oninput。

Answer 3

这不是一回事.首先在语义上,textarea的目的是编写/编辑纯文本,而使用contentEditable,您可以编辑列表(参见:htmldemo)其次,行为也不同.例如,在Chrome中测试下面的链接并删除所有内容时,您将失去焦点(div元素消失),这不是预期的行为,或者它是否是白痴.