坑爹的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!

IE9 placeholder 不兼容的解决的更多相关文章

  1. placeholder不兼容 IE10 以下版本的解决方法

    对于密码输入框placeholder的兼容问题:HTML代码:<input type="password" id="loginPassword" plac ...

  2. 几个常用的CSS3样式代码以及不兼容的解决办法

    原文:几个常用的CSS3样式代码以及不兼容的解决办法 border-radius实现圆角效果 CSS3代码: -webkit-border-radius:10px; -moz-border-radiu ...

  3. spirng中的asm与jdk不兼容<已解决>

    转载自:spirng中的asm与jdk不兼容<已解决> 前言 不知道前面对eclipse做了什么,使用maven来创建项目,然后转成web,启动的时候一直报错.我弄了好久,还是无法解决,先 ...

  4. VMware workstation虚拟机配置文件不兼容无法使用解决方法

    VMware workstation虚拟机配置文件不兼容无法使用解决方法打开VMware workstation虚拟机提示:配置文件"--.vmx"是由Vmware产品创建,但该产 ...

  5. js解决IE8、9下placeholder的兼容问题

    由于placeholder是html5的新属性,在IE8.IE9下是不能显示的,有兼容性问题. 解决思路: 1.判断目前浏览器是否支持placeholder属性 2.若不支持,则将type=" ...

  6. input事件在ie9以下不兼容问题完美解决

    上周四好不容易加了几天班把刚接手的一个pc页面做完,周五同事说要兼容ie7~ie9,结果在上面一跑,输入都没法输入. 我的需求是用6个span作为虚拟的密码输入框,实际上是用一个藏在页面里的input ...

  7. ie9 placeholder兼容

    .phcolor{ color:#999;}//css样式 function isPlaceholer(){ var input = document.createElement("inpu ...

  8. 解决IE中placeholder的兼容问题

    定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(hint). 该提示会在输入字段为空时显示,并会在字段获得焦点时消失. 注释:placeholder 属性适用于以下的 &l ...

  9. ie9 placeholder兼容代码方法

    function guid() { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { var r ...

随机推荐

  1. 解决svnserve: Can't bind server socket: Address already in use

    最近在忙着搭建jenkins系统集成版本控制和git分布式版本控制,其中涉及到了点svn方面的,由于自己也是第一次搭建svn,挺顺利的,中间遇到点小问题: 我使用的是yum安装的svn,安装完成配置结 ...

  2. node+npm安裝配置

    控制臺輸入node 根據提示安裝   sudo apt-get install -g npm配置淘寶源 npm config set registry https://registry.npm.tao ...

  3. json学习笔记--在JavaScript中的使用

    1.字符串转换为JavaScript对象 var jsonStr = '[' + '{"name":"陶国荣","sex":"男& ...

  4. SQL单行函数和多行函数

    单行函数和多行函数示意图: 单行函数分为五种类型:字符函数.数值函数.日期函数.转换函数.通用函数 单行函数: --大小写控制函数 select lower('Hello World') 转小写, u ...

  5. 主攻ASP.NET MVC4.0之重生:发邮箱激活验证

    导入Interop.jmail组件 using jmail;using System.Net.Mail; 点击下载源代码 Controller相关代码 public class SendEmailCo ...

  6. 关于读取本地text文件,自动被添加空格的问题

    最近做一个小程序,读取本地指定路径下的text文件,逐行获取text文本然后再进行处理,结果遇到了一个奇葩问题,先插个图片给各位看官 坑:本地text文件中数据为1123/10(数据反复检查无空格,换 ...

  7. Eclipse开发快捷键精选

    1.alt+?或alt+/:自动补全代码或者提示代码2.ctrl+o:快速outline视图3.ctrl+shift+r:打开资源列表4.ctrl+shift+f:格式化代码5.ctrl+e:快速转换 ...

  8. 虚拟机开启Linux时出现“我以复制虚拟机”、“我已移动虚拟机”

    当出现标题的情况时,并且网络出现状况时,可以尝试一下解决办法 首先用ifconfig -a命令调出现在的网卡驱动的名称和HWaddr地址,然后再编辑/etc/sysconfig/networking/ ...

  9. Python ssh 远程执行shell命令

    工具 python paramiko 远程执行命令 import paramiko ssh = paramiko.SSHClient() key = paramiko.AutoAddPolicy() ...

  10. STL视频_01

    ZC:这里视频里面有一个调试小技巧,VS08/VS2010开始,控制台程序会自动退出(不像VC6),那么可以在 函数退出的最后一句语句上设置断点,然后查看控制台打印出来的信息.ZC:这一讲,给我的感觉 ...