您可以在< textarea>中使用多行HTML5占位符文字吗? [英] Can you have multiline HTML5 placeholder text in a <textarea>?

查看:327
本文介绍了您可以在< textarea>中使用多行HTML5占位符文字吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用HTML5的占位符属性来关注文本字段时,文本字段中会出现鬼文字:

textname =emailplaceholder =输入电子邮件/>

我想使用相同的机制在textarea中使用多行占位符文本,可能是这样的:

 < textarea name =storyplaceholder =输入story \\\
next line\\\
more>< ; / textarea的>

但是那些 \\\
s显示在文本中,不会导致换行符...有没有一种方法可以有多行占位符?



UPDATE :我使用这个工具的唯一方法是使用 jQuery Watermark插件,它接受占位符文本中的HTML:

  $('。textarea_class')。watermark('输入故事< br /> * newline',{fallback:false }); 


解决方案

规范不允许换行符或回车符。


占位符属性表示旨在帮助用户输入数据的简短提示(一个字或短
短语)。提示可以是
样本值或预期格式的简要说明。
属性(如果指定)必须具有不包含U + 000A
LINE FEED(LF)或U + 000D CARRIAGE RETURN(CR)字符的值。
< blockquote>

显然,建议使用 title 属性来保存更长的时间。


对于较长的提示或其他咨询性文字,title属性更适合


编辑(1/8/18):



对于< textarea> 的这似乎并非如此。该规范实际上概述了回车+换行必须由浏览器呈现。


用户代理应该向用户显示此提示当元素的值是空字符串并且控件未被聚焦时(例如,通过将其显示在空白未聚焦的控件中)。提示中的所有U + 000D CARRIAGE RETURN U + 000A LINE FEED字符对(CRLF)以及提示中的所有其他U + 000D CARRIAGE RETURN(CR)和U + 000A LINE FEED(LF)字符必须进行处理作为提示提示时的换行符。


请参阅文档: http://w3c.github.io/html/sec-forms.html#element-attrdef-textarea-placeholder

也反映在MDN上: https ://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea



FWIW,当我试用Chrome 63.0时。它确实按照它说的那样工作。


I have ghost text in textfields that disappear when you focus on them using HTML5's placeholder attribute:

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

I want to use that same mechanism to have multiline placeholder text in a textarea, maybe something like this:

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

But those \ns show up in the text and don't cause newlines... Is there a way to have a multiline placeholder?

UPDATE: The only way I got this to work was utilizing the jQuery Watermark plugin, which accepts HTML in the placeholder text:

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

解决方案

The specification does not allow line feed or carriage return characters.

The placeholder attribute represents a short hint (a word or short phrase) intended to aid the user with data entry. A hint could be a sample value or a brief description of the expected format. The attribute, if specified, must have a value that contains no U+000A LINE FEED (LF) or U+000D CARRIAGE RETURN (CR) characters.

Apparently, the recommendation is to use a title attribute for anything longer.

For a longer hint or other advisory text, the title attribute is more appropriate.

EDIT (1/8/18):

For <textarea>'s this does not appear to be the case. The spec actually outlines that carriage returns + line breaks MUST be rendered as such by the browser.

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.

See docs: http://w3c.github.io/html/sec-forms.html#element-attrdef-textarea-placeholder
Also reflected on MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea

FWIW, when I try on Chrome 63.0.3239.132, it does indeed work as it says it should.

这篇关于您可以在&lt; textarea&gt;中使用多行HTML5占位符文字吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆