思享工具箱

IE9 placeholder 不兼容的解决

摘要：
varisPera=userAgent.indexOf（“Opera”）&gt；variasIE=userAgent.indexOf（“兼容”）&gt；userAgent.indexOf（“MSIE”）&gt；varreIE=newRegExp（“MSIE（\d+\.\d+）；IE7=fIVersion==7.0；

坑爹的IE9-，真的是够够的了，不过公司不要求兼容这个玩意了，自己觉得兼容这个鬼还是挺有挑战性的，自己也碰到不少难题，一个个解决。

css:

.placeholderColor { color : #999; }

　

先判断浏览器类型（仅判断IE，如果需要请自行查找，线上很多）：

    function myBrowser(){
           var userAgent = navigator.userAgent;
           var isOpera = userAgent.indexOf("Opera") > -1;
        var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器
        if (isIE) {
            var IE5 = IE55 = IE6 = IE7 = IE8 = IE9 = IE10 = IE11=false;
            var reIE = new RegExp("MSIE (\d+\.\d+);");
            reIE.test(userAgent);
            var fIEVersion = parseFloat(RegExp["$1"]);
            IE55 = fIEVersion == 5.5;
            IE6 = fIEVersion == 6.0;
            IE7 = fIEVersion == 7.0;
            IE8 = fIEVersion == 8.0;
            IE9 = fIEVersion == 9.0;
            IE10 = fIEVersion == 10.0;
            IE11 = fIEVersion == 11.0;
            
            if (IE55) {
                return "IE55";
            }
            if (IE6) {
                return "IE6";
            }
            if (IE7) {
                return "IE7";
            }
            if (IE8) {
                return "IE8";
            }
            if (IE9) {
                return "IE9";
            }
        }
    }

下面是placeholder的修复函数：

function fix_ie_placeholder(){
        $("[placeholder]").each(function(){
            var el = $(this);
            var placeholder = el.attr("placeholder");
            if(el.prop("type")=="password")
            {
                el.focus(function ()
                {
                    $(this).prop("type","password");
                    if($(this).val() == $(this).attr("placeholder"))
                    {
                        $(this).val('').removeClass("placeholderColor");
                    }
                }).blur(function ()
                {
                    if($(this).val()=='')
                    {
                        $(this).prop("type","text");
                        $(this).val($(this).attr("placeholder")).addClass("placeholderColor");
                    }
                }).blur();
                
                if(el.val()==''||el.val()==el.attr("placeholder"))
                {
                    el.rop("type","text");
                    el.val($(this).attr("placeholder")).addClass("placeholderColor");
                }
            }
            else 
            {
                el.focus(function ()
                {
                    if($(this).val() == $(this).attr("placeholder"))
                    {
                        $(this).val('').removeClass("placeholderColor");
                    }
                }).blur(function ()
                {
                    if($(this).val()=='')
                    {
                        $(this).val($(this).attr("placeholder")).addClass("placeholderColor");
                    }
                });
                
                if(el.val()==''||el.val()==el.attr("placeholder"))
                {
                    el.val($(this).attr("placeholder")).addClass("placeholderColor");
                }
            }
        });
    };

如果为IE9，则执行placeholder修复函数：

if（myBrowser() == "IE9"）{
　　fix_ie_placeholder();
}

OK，试一下吧，应该好用，我自己测试IE9没问题。Happy New Year!

标签：#placeholder#IE#$#userAgent | 浏览：120 | 发布日期：

免责声明：文章转载自《IE9 placeholder 不兼容的解决》仅用于学习参考。如对内容有疑问，请及时联系本站处理。

上篇BeamNG.drive物理引擎评鉴安卓开发之activity详解（sumzom）下篇

宿迁高防，2C2G15M，22元/月；香港BGP，2C5G5M，25元/月 雨云优惠码：MjYwNzM=

相关文章

【使用 DOM】为DOM元素设置样式

1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表，它会返回一组对象集合，这些对象代表了与文档管理的各个样式表。 每个样式表 都由一个CSSStyleSheet 对象代表，它提供了一组属性和方法来操作文档里的样式。 1.1 获得样式表的基本信息 第一步是获得定义在文档中的样式表的一些基本信息。 <!...

RT-Thread代码启动过程——以及 $Sub$ $main 与 $Super$ $main

【转】https://blog.csdn.net/yang1111111112/article/details/80913001 我们找到系统复位的地方，可以往下单步跟踪。 ①从系统初始化开始执行，将函数地址赋给R0寄存器，跳转到R0地址执行并返回此处（BLX是带链接的跳转，即带返回的跳转）。 ②将main函数地址给R0，将函数地址赋给R0，跳转到R0地址...

将某个div内容保存成图片，使用html2canvas截图方法（高清图并解决图片跨域问题）

首先附上html2canvas的CDN地址：http://www.bootcdn.cn/html2canvas/ ; 此方法可截取整个div的内容，包括不可视区域，并且可以实现跨域图片截图。之前看了很多关于html2canvas插件图片跨域的解决办法，大部分的答复是在服务器端配置，之后将useCORS属性设置为true，但是如果图片是保存在别人家的服务器上...

Linux bash运维操作日志审计（单服务器）

目前公司有几台机器比较重要，需要把所有用户的操作记录下来，于是就是参照资料来完成 1. vim /etc/profile.d/oplogrc.sh logdir=/opt/oplog userdir=$logdir/${LOGNAME} DT=`date +"%Y%m%d"` export HISTFILE="/$userdir/history.$DT"...

HTML控件篇 -- input

1. 取消input提示框及自动填充： <input type="text" autocomplete="off" /> 处理chrome下自动填充黄底样式问题： /*input样式特殊处理*/input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-...

shell中的条件判断

1.测试内容  2.测试方法  3.应用示例 　　在shell脚本中应用条件测试时，关键是“测试表达式”。在条件语句中测试时首先分清楚测试什么类型的信息：数字、字符串、还是一个文件，要么就是一个逻辑关系。当遇到不同的测试类型时自然就有不同的“测试属性”，理解这个测试属性是必须的。不然就不知道从何处下手。 　　判断的返回值：真、假。 　　当判断的条件是一...

最新文章

随机推荐

思享工具箱导航