老生常谈IE兼容性：ie6 javascript:void(0)、IE7 input透明、IE8 j

这年头依旧有人坚守IE6阵营，为什么呢？人家客户说单位以前系统必须用IE6没办法升级，这理由还真充分！

一、IE6 对javascript:void(0)的支持

     问题：<a href=”javaScript:void(0)” οnclick=”doSomething();”>click me</a>，发现点击事件不起作用。原因是和IE6的事件冒泡处理方法有关，网上一大堆讨论。

     其实以前遇到过，以前是在onclick事件加上return false;这次发现另一解决办法。

     解决办法：

             1、改为<a href=”javaScript:void(0)” οnclick=”doSomething();return false;”>click me</a>

             2、改为<a href=”#” οnclick=”doSomething();”>click me</a>，但会致使页面跳转到顶端，不推荐。

             3、改为<a href=”###” οnclick=”doSomething();”>click me</a>

 

二、IE7 input设置背景色为透明、且父节点position:absolute;时，无法点击得到焦点

     问题：<div id="input" style='position:absolute;.....'><input type="text" id="account" placeholder="账号" style='background-color:transparent;' /></div>

     真是无语，IE6都正常唯IE7存在此问题

 

     解决办法：

            1、父节点不使用绝对定位改为浮动，如<div id="input" style='foat:left;.....'>

            2、input加上背景色<input type="text" id="account" placeholder="账号" style='background-color:#fff' />

            3、input加上背景图，指向一个全透明的图片<input type="text" id="account" placeholder="账号" style='background-image:url(images/empty.gif)' />

 

三、IE8用jquery动态加载css

      问题：jquery版本1.10.2，使用$("<link>").attr({ rel: "stylesheet",type: "text/css",href: "site.css"}).appendTo("head");加载css，IE9+、Chrome都正常，测试到IE8就不行了，网上有人说IE8可IE6、7不行，可能与jquery版本有关。

      解决办法：用传统的方式document.createElement...head.appendChild...代码不附，网上大把。

 

四、RGBA的低版本实现办法

       这纯属意见发现，记录一下。IE各版本对rgba的支持见

 

类型	Internet Explorer	Firefox	Chrome	Opera	Safari
版本	(×)IE6	(√)Firefox 3.0.10	(√)Chrome 2.0.x	(√)Opera 9.64	(√)Safari 4
(×)IE7
(×)IE8
(√)IE9

 

IE家族只有9以后的版本支持该属性；

      解决办法：IE6-8用滤镜实现filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#BF000000,endColorstr=#BF000000);

转载于:https://my.oschina.net/u/2558718/blog/713755