今天帮助女票解决了一个js兼容ie8的问题,记录一下。
有时候我们发现在Chrome或者高版本的IE下运行得好好的代码,到ie8下却出错了,这很尴尬,特别是js。js一旦出错,那么下面的代码就统统不会运行了。
就如我们这次遇到的情况,我们使用了DateTimePicker日期控件,其中用到了Indexof()这个函数,然而ie并不支持,所以导致了后面用js生成的表格都无法显示出来。
先谷歌了一下,发现可以手动重写indexof()函数.
if (!Array.prototype.indexOf)
{
Array.prototype.indexOf = function(elt /*, from*/)
{
var len = this.length >>> 0;
var from = Number(arguments[1]) || 0;
from = (from < 0)
? Math.ceil(from)
: Math.floor(from);
if (from < 0)
from += len;
for (; from < len; from++)
{
if (from in this &&
this[from] === elt)
return from;
}
return -1;
};
}
只要将以上的代码放在使用indexof()函数之前,就可以在ie8中使用indexof()函数了。
然而有报了一个trim()函数的兼容性错误,ie8同样不支持这个函数,囧。
好吧,如法炮制
String.prototype.trim=function(){
return this.replace(/(^\s*)|(\s*$)/g, "");
}
然后把这两个函数写成js文件,判断是ie8则引入。但是想想,难道有一个不兼容,我就要重写一个函数。有没有别人已经写好的。
Google一下,果然!
找到一个开源项目:isbetter.js
具体的自己看吧:GitHUb地址
##需要注意
- 1.这个项目目前也有一些BUG,所以如果你发现了BUG自己再完善一下。不要觉得别人的项目有点错误就抛弃不用,毕竟bug是该不完的。
- 2.由于使用的Jquery版本不同,也会引发不同的兼容性问题。需要自己写缺失属性的代码,或者引起错误的isBetter.js的地方添加try-catch
- 3.注意把isBetter.js放在Jquery.js之前。否则或抛出Jquery的兼容性错误。
- 4.不要使用注释引入代码,因为这一招对ie10+已经无效了
<!--[if lte IE 8]>
<script src="ieBetter.js"></script>
<![endif]-->
使用以下代码引入isBetter.js
<script>
if (!document.addEventListener) {
// IE6~IE8
document.write('<script src="ieBetter.js"><\/script>');
}
</script>