html - <textarea> 中可以包含多行 HTML5 占位符文本吗？

Question

当您使用 HTML5 的占位符属性关注它们时，文本字段中的幻影文本会消失:

<input type="text" name="email" placeholder="Enter email"/>

我想使用相同的机制在文本区域中包含多行占位符文本，可能是这样的:

<textarea name="story" placeholder="Enter story\n next line\n more"></textarea>

但是那些 \n 出现在文本中并且不会导致换行...有没有办法使用多行占位符？

更新:我让它工作的唯一方法是利用 jQuery Watermark plugin ，它在占位符文本中接受 HTML:

$('.textarea_class').watermark('Enter story<br/> * newline', {fallback: false});

Answer 1

对于 <textarea> s the spec特别指出占位符属性中的回车符 + 换行符必须由浏览器呈现为换行符。

User agents should present this hint to the user when the element's value is the empty string and the control is not focused (e.g. by displaying it inside a blank unfocused control). All U+000D CARRIAGE RETURN U+000A LINE FEED character pairs (CRLF) in the hint, as well as all other U+000D CARRIAGE RETURN (CR) and U+000A LINE FEED (LF) characters in the hint, must be treated as line breaks when rendering the hint.

也反射(reflect)在 MDN 上:https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-placeholder

FWIW，当我尝试使用 Chrome 63.0.3239.132 时，它确实可以正常工作。