Bootstrap 的 IE8 中不显示占位符
Posted
技术标签:
【中文标题】Bootstrap 的 IE8 中不显示占位符【英文标题】:Placeholders are not displaying in IE8 for Bootstrap 【发布时间】:2012-10-27 12:55:25 【问题描述】:我正在为我的项目使用 Bootstrap。除 Internet Explorer 8 及更低版本外,所有浏览器的占位符都可以正常显示。
是否有任何解决方案可以在 IE8 中获得占位符支持?
【问题讨论】:
IE 不支持占位符,您必须使用一个值并使用 javascript 将其设置为焦点/模糊等。 您可以使用placeholder
attribute polyfill 在所有浏览器中添加对placeholder
属性的支持。 IE 10 以下不支持。
如果他们对您有帮助,您应该接受其中一个答案
相关问题 - ***.com/questions/6366021/placeholder-in-ie9/14981525
【参考方案1】:
你可以使用jquery水印插件
https://code.google.com/p/jquery-watermark/
【讨论】:
【参考方案2】:IE9 及以下不支持placeholder
属性。见this
您可以使用EZPZ hints 来补充它。如果浏览器是 IE 就加载脚本
<!--[if lt IE 10]>
<script src="PATHTOFILE"></script>
<![endif]-->
EZPZ 提示允许您继续在现代浏览器中使用 placeholder
。
例子:
<input type="text" id="search" placeholder="Search" />
$("input[type=text]").ezpz_hint();
【讨论】:
【参考方案3】:如果没有插件,这应该不难解决,我猜接近这个的东西可以解决问题:
var test = document.createElement('input');
if (!('placeholder' in test))
$('input').each(function ()
if ($(this).attr('placeholder') != "" && this.value == "")
$(this).val($(this).attr('placeholder'))
.css('color', 'grey')
.on(
focus: function ()
if (this.value == $(this).attr('placeholder'))
$(this).val("").css('color', '#000');
,
blur: function ()
if (this.value == "")
$(this).val($(this).attr('placeholder'))
.css('color', 'grey');
);
);
【讨论】:
IE 在if (!'placeholder' in test)
上崩溃
@pinouchon - 它不适合我,但如果这是一个问题,你所要做的就是将它包裹在括号中,这应该可以解决它。也将其添加到答案中。【参考方案4】:
你可以使用这个插件 https://github.com/mathiasbynens/jquery-placeholder 甚至可以在 IE6 中运行
【讨论】:
【参考方案5】:加上鲁本斯的回答,这里有一个演示
http://mathiasbynens.be/demo/placeholder
【讨论】:
以上是关于Bootstrap 的 IE8 中不显示占位符的主要内容,如果未能解决你的问题,请参考以下文章