IE 输入标签上的占位符属性？答案

【问题标题】：Placeholder attribute on input tags for IE?IE 输入标签上的占位符属性？
【发布时间】：2012-05-07 07:33:39
【问题描述】：

我知道 Internet Explorer 不支持输入标签的占位符属性，但肯定在 2012 年 IE 必须有另一种解决方案？

【问题讨论】：

google.com/search?q=placeholder+polyfill
好问题。在跳槽回答之前，我们先看看其他浏览器中原生支持的情况。在 IE10 RP 上测试，-ms-input-placeholder{} 伪选择器支持所有 13 个属性 listed on this test page。 Chrome 不支持在占位符中填充，而 FF 缺少行高。较新版本的 Safari 支持 13 个属性中的 5 个（而之前的版本支持 10 个属性）。从 Opera 11 开始，占位符样式被删除。

标签： css internet-explorer

【解决方案1】：

其实IEdoes support是2012年（版本10）的占位符属性。将此与旧版浏览器的 a polyfill 结合使用，您应该有一个全面的解决方案来解决您的问题。

【讨论】：

您可以将它与占位符不是标签的替代品（它们是提示和示例）相结合，而不是使用 polyfill '不支持他们。
html5please.com 是此类信息的另一个好资源。在占位符上：http://html5please.com/#placeholder

【解决方案2】：

不久前我写了一个 jQuery 插件，它将为任何不支持它的浏览器添加占位符支持。

Placeholder Text in IE

【讨论】：

感谢您的回复。我试过你的代码，但我似乎无法让它工作。我制作了一个非常简单的单行 html 页面以在 IE 9 中进行测试。这是我的代码：
我所做的有什么问题。我真的尝试了各种各样的东西，我的链接很好......
您将需要围绕函数调用的 jQuery 文档就绪函数。 $(function() { $.fn.placeholder(); });
谢谢科里。您的解决方案效果很好，我非常感谢您愿意提供帮助。你为我节省了很多时间和精力。非常感谢

【解决方案3】：

我们已经在生产环境中使用这个 jQuery 插件几个星期了，它似乎工作得很好。

http://webcloud.se/code/jQuery-Placeholder/

【讨论】：

【解决方案4】：

http://the.deerchao.net/PlaceHolder 它可以在 ie 上运行，无需调用任何函数...

【讨论】：

【解决方案5】：

试试这个我开发的jQuery插件

https://github.com/ramsunvtech/jQuery-Plugins/tree/master/IEPlaceHolder

【讨论】：

【解决方案6】：

是的，IE8 和 IE9 有一个非常简单的解决方案，因为在 IE 的更高版本上它已经可以工作了。（IE10、IE11等）

这是我找到的解决方案：

1.检测 Internet Explorer 版本

<!--[if lt IE 10]>       
    <script type="text/javascript">var ie = 9;</script>      
<![endif]-->     
<!--[if lt IE 9]>                   
    <script type="text/javascript">var ie = 8;</script>          
<![endif]-->

2。修复占位符

if (typeof ie == 'undefined') var ie = 10;   
if (ie == 8 || ie == 9){  

    $("input[placeholder]").each(function() {
        this.value = $(this).attr('placeholder');
    });        

    $("input[placeholder]").focus(function() 
        if (this.value == $(this).attr('placeholder')) this.value = '';
    }).blur(function() {   
        if (this.value == '')
            this.value = $(this).attr('placeholder'); 
    });
}

【讨论】：