HTML 占位符浏览器兼容性
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4004087/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML Placeholder browser compatibility
提问by NoodleOfDeath
What browsers support the placeholder html tag for text inputs? Does Internet Explorer support it? (I have a JavaScript placeholder that I can use for the browsers that do not support it.)
哪些浏览器支持文本输入的占位符 html 标签？Internet Explorer 支持吗？（我有一个 JavaScript 占位符，可用于不支持它的浏览器。）
<input type=TEXT placeholder="placeholder here" />
<input type=TEXT placeholder="placeholder here" />
采纳答案by Tim
It is currently supported by all major browsers except IE 9 and earlier and Opera mini.
目前，除 IE 9 及更早版本和 Opera mini 之外的所有主要浏览器都支持它。
For updates, look at the w3schools-specsOr even better, view this overview.
有关更新，请查看w3schools-specs或者甚至更好，查看此概述。
回答by Jera
For anyone interested, this is the jQuery Fallback that I use
I use it with jQuery Validation Engine.
Replace FORMCLASS with the class of your form.
对于任何感兴趣的人，这是我使用的 jQuery 回退，
我将它与 jQuery 验证引擎一起使用。
将 FORMCLASS 替换为您的表单类。
<!-- IF IE - use Placeholder Fallback -->
<!--[if lt IE 10 ]>
<script>
$(".FORMCLASS").find('[placeholder]').each(function(){
$(this).val($(this).attr('placeholder'));
$(this).focus(function() {
if ($(this).attr('placeholder')==$(this).val()) {
$(this).val('');
}
});
});
</script>
<![endif]-->
回答by Jera
According to this, IE 10 supports it. (You can test it here)
I fix the problem this -probably the most easiest- way:
我解决这个问题 - 可能是最简单的 - 方法：
<!--[if lt IE 10]>email:<![endif]-->
<input placeholder='email' type='text' name='email'>
回答by vinz
Firefox also supports it since 4.0
Firefox 也从 4.0 开始支持它
回答by Sanjay
IE is not supporting placeholders
IE 不支持占位符
I feel this code better and it works in all major browsers
我觉得这段代码更好，它适用于所有主要浏览器
<input id="example-email" type="text" value="Email Address" onfocus="if(this.value === 'Email Address') this.value = '';" onblur="if(this.value === '') this.value = 'Email Address';" name="example-email">
回答by jp2code
Question may have been answered a few years ago, but I found it today doing a search.
问题可能在几年前就得到了回答，但我今天在搜索时发现了它。
Since a good reference and pics were not provided before, I am updating this question with both.
由于之前没有提供好的参考和图片，我正在用两者更新这个问题。
HTML5 placeholder Attributebasically says:
HTML5占位符属性基本上说：
The placeholder attribute is supported in all major browsers, except Internet Explorer.
所有主要浏览器都支持占位符属性，但 Internet Explorer 除外。
FYI:This includes IE9.
仅供参考：这包括 IE9。
回答by Mecalito
In case someone is looking for a HTML5-placeholder alike solution for non-supported browsers here is a good article about it:
如果有人正在为不受支持的浏览器寻找类似 HTML5 占位符的解决方案，这里有一篇关于它的好文章：
http://www.viget.com/inspire/a-better-jquery-in-field-label-plugin/
http://www.viget.com/inspire/a-better-jquery-in-field-label-plugin/
回答by Wilk
Placeholdersare fully supported by:
占位符完全支持：
- FF 4+
- Chrome 4+
- Safari 5+
- Opera 11.6+
- IE 10+
- 外援 4+
- 铬 4+
- Safari 5+
- 歌剧 11.6+
- 浏览器 10+
回答by vahanpwns
For those who want the simplest solution, use the built-in features!
对于那些想要最简单解决方案的人，请使用内置功能！
<input type="text" name="email" value="Email Address" placeholder="Email Address" onfocus="if(this.value==this.placeholder) this.value=''" onblur="if(this.value=='') this.value=this.placeholder">
Tested in chrome and IE8 :)
在 chrome 和 IE8 中测试:)
Note: I use this with more javascript to validate the input and give feedback inside the field itself by changing the value and placeholder at runtime.
注意：我将它与更多的 javascript 一起使用来验证输入并通过在运行时更改值和占位符来在字段本身内部提供反馈。
回答by galengodis
I know it's an old question. My suggestion is to use Modernizr for detecting placeholder support! https://modernizr.com/
我知道这是一个老问题。我的建议是使用 Modernizr 来检测占位符支持！https://modernizr.com/
