比来在做项目的晋级作业，主要是跨浏览器这块，遇到了一些疑问并且做了总结，贴出来与咱们同享一下，如果你也遇到类似的疑问，希望对你有一定的帮忙。闲话少叙，进入正题，按照我总结的次第来吧。 1、获取浏览器的版别，这个是很重要的，在做这个作业之初我就写好了，因为过程中总有无法兼容的情况，就必须进行浏览器区分： 我封装了一下，并且经过了检验【我这里不考虑IE的兼容方式】，喜欢的兄弟可以直接拿走。 var B http://www.star1234.info rowserType =
{
IE7: "MSIE 7.0",
IE8: "MSIE 8.0",
IE9: "MSIE 9.0",
IE10: "MSIE 10.0",
Chrome: "Chrome",
Firefox: "Firefox",
Safari: "Safari"
};
///
/// Get Browser version
///
function getBrowserVersion()
{
if (navigator.userAgent.indexOf("MSIE 7.0") > 0)
{
return BrowserType.IE7;
}
if (navigator.userAgent.indexOf("MSIE 8.0") > 0)
{
return BrowserType.IE8;
}
if (navigator.userAgent.indexOf("MSIE 9.0") > 0)
{
return BrowserType.IE9;
}
if (navigator.userAgent.indexOf("MSIE 10.0") > 0)
{
return BrowserType.IE10;
}
if (navigator.userAgent.indexOf("Firefox") > 0)
{
return BrowserType.Firefox;
}
if (navigator.userAgent.indexOf("Chrome") > 0)
{
return BrowserType.Chrome;
}
if (navigator.userAgent.indexOf("Safari") > 0)
{
return BrowserType.Safari;
}
} 2、关于IFrame的疑问，这个在跨浏览器的时分你一定会碰到，这个我也封装了两个function，同享一下: ///
/// Get iFrame DOM Function [IE、Firefox]
///
function getIFrameDOM(id)
{
var iframeObj = null;
if (document.getElementById(id) != null)
{
iframeObj = document.getElementById(id).contentDocument || document.frames[id];
}
return iframeObj
}
///
/// Get iFrame Window Function [IE、Firefox]
///
function getIFrameWindow(id)
{
var iframeWindow = null;
if (document.getElementById(id) != null)
{
iframeWindow = document.getElementById(id).contentWindow || document.frames[id].window;
}
return iframeWindow;
}
真有用的多是第二个办法，取iFrame的window，然后调用window下的办法。 3、关于IFrame加载结束的工作区分--之前用的是IE的onreadystatechange if (getBrowserVersion() == BrowserType.IE8 || getBrowserVersion() == BrowserType.IE7)
{
$('#framePrintMap')[0].onreadystatechange = function ()
{
if (this.readyState == 'loaded' || this.readyState == 'complete')
{
var json = jQuery.parseJSON($('#hidDatas').val());
var options = jQuery.parseJSON($('#hidOptions').val());
getIFrameWindow('framePrintMap').initPrintMap(json, options);
}
}
}
else
{
$('#framePrintMap')[0].onload = function ()
{
if (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')
{
var json = jQuery.parseJSON($('#hidDatas').val());
var options = jQuery.parseJSON($('#hidOptions').val());
getIFrameWindow('framePrintMap').initPrintMap(json, options);
}
}
}
$('#framePrintMap').attr('src', 'ThematicPrintMap.aspx'); 我详细说下，如果是IE7和IE8，可以用onload工作，可是它没有readyState方针，未加载结束直接调用iFrame里面的办法，报错了；IE9的话这两个分支都可以了，onreadystatechange是只需IE才支撑，Safari/Chrome/Safari就只能走onload的分支了，那为什么还加个!readyState？是因为在Firefox里面没有readyState方针，所以只能这样区分。 4、关于Table自动拉伸在跨浏览器的区别：请参见我的另一篇文章【table自动拉伸在chrome与IE中的区别】 5、关于各个浏览器对小数的处置：请参见我的另一篇文章【各浏览器对小数处置取整的情况对比【IE、chrome、firefox、safari】】 6、关于捕获鼠标方位在个浏览器中的不一样：请参见我的另一篇文章【JavaScript中鼠标event的方位(clientX,layerX,x,offsetX等)】 7、Chrome/Safari关于position:absolute的处置与其他浏览器有些不一样：IE和Firefox会在父元素的内部，而Chrome/Safari会跑出父元素。 8、IE7与其他浏览器的text-align：center处置不一样：IE7：内部的文本与div都居中，其他浏览器：只是文本居中，div不居中：将td中的内容包在div内部可以处置，td内的div的css为text-align:left，div的css为text-align：center，内部的文本就可以居中了。另一个闪现year的title的div也是一样设置就可以了。 9、关于IE7的IE=EmulateIE7与IE=7及实在IE7的区别；请参阅【“浏览器方式”和“文档方式”之间的区别】 10、Chrome/Safari下点击submit提交数据到后台：如果数据量逾越512k时会自动堵截，把input的type改成hidden就可以了。 11、父容器设置overflow:auto;子元素设置特色position:relative;在ie7中该子元素不随翻滚条翻滚：给设置了overflow:auto特色的容器也加上position:relative就可以了。 12、Safari下时辰Date.Parse时辰不准确的疑问：【有时分准确，有时分不准确，检验发现到了2034年之后就不准确了】，这个疑问真是浏览器内核没有做好，没办法，要兼容它还得想办法： 先将日期转化成自己定制的标准格式： Date.prototype.format = function (format)
{
var o =
{
"M ": this.getMonth() 1, // month
"d ": this.getDate(), // day
"h ": this.getHours(), // hour
"m ": this.getMinutes(), // minute
"s ": this.getSeconds(), // second
"q ": Math.floor((this.getMonth() 3) / 3), // quarter
"S": this.getMilliseconds() // millisecond
}
if (/(y )/.test(format))
{
format = format.replace(RegExp.$1, (this.getFullYear() "").substr(4 - RegExp.$1.length));
}
for (var k in o)
{
if (new RegExp("(" k ")").test(format))
{
format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" o[k]).substr(("" o[k]).length));
}
}
return format;
} 然后解析这个格式的时辰就可以了， ///
/// Time format:2011-10-01 00:00:00 *[SQL:120] || 2011/10/01[SQL:111]
///
this.dateFromString = function (str)
{
var arr = str.split(/[^0-9]/);
var curTime = null;
if (arr.length == 3)
{
curTime = new Date(arr[0], arr[1] - 1, arr[2]);
}
else if (arr.length >= 6)
{
curTime = new Date(arr[0], arr[1] - 1, arr[2], arr[3], arr[4], arr[5]);
}
return curTime;
} 这个一般用在将时辰绑定到某个元素的扩展特色上，然后用的时分进行解析，div.data('time')。 13、Firefox下不支撑嵌套function。 http://www.aaafaipiao.com
