实现IE浏览器兼容placeholder效果

来源：互联网发布：男生行为心理女生必知编辑：程序博客网时间：2024/06/04 23:59

placeholder是HTML5的属性之一，在不同的浏览器( 支持HTML5的现代浏览器 )中会有略微不同的显示效果，
在Chrome( v31.0.1650.63 m)、Firefox( v21.0 )、360安全( v6.3 极速模式 )中，输入栏获得焦点后，提示文字并不消失，但是IE6-IE9 是不支持placeholder属性的。

思路是，首先判断浏览器是否支持placeholder属性，如果不支持的话，就遍历所有input输入框，获取placeholder属性的值填充进输入框作为提示信息，同时字体设置成灰色。

        var browser=navigator.appName;        var b_version=navigator.appVersion;        var version=b_version.split(";");        var trim_Version=version[1].replace(/[ ]/g,"");        if(browser=="Microsoft Internet Explorer" && trim_Version=="MSIE9.0"){            function holder(Iip){                var txtHolder=Iip.attr("placeholder");                Iip.val(txtHolder).addClass("hint");                Iip.attr("type","text");                Iip.focus(function(){                    if($(this).val() == txtHolder){                        $(this).val("").removeClass("hint");                    }                    if(Iip.attr("name")=="password"){                        Iip.attr("type","password");                    }                }).blur(function(){                    if($(this).val().trim() === ""){                        $(this).val(txtHolder).addClass("hint");                        Iip.attr("type","text");                    }                });            }        }

2 0