跨浏览问题总结和window.event跨浏览器问题的解决方法

------------------------------------------------
window.event跨浏览器问题的解决方法
------------------------------------------------
如果遇到 window.event时在函数中就要特别处理:
e.g.
页面中:
<input type="button" value="test" onclick="javasctipt:testOnclick(event)">


javasctipt中的代码

function testOnclick(evt){
evt = evt ? evt : (window.event ? window.event : null);
}


------------------------------------------------------
跨浏览问题总结
-------------------------------------------------------
注意的一些问题:

(一)尽量使用javascript/DOM标准


(二)标准有时也不能跨浏览器

1)要面对跨浏览器的时候经常会遇到一些ie特有的函数?
可以这样解决:
做一个判断把ie和firefox的javascript代码分开写

if (typeof window.ActiveXObject != 'undefined') { // 支持IE浏览器
//do some thing here
}
else if((typeof document.implementation != 'undefined')&&(typeof document.implementation.createDocument!='undefined')) { // 支持Firefox浏览器
//do some thing here
}


2)如果遇到 window.event时在函数中就要特别处理:
e.g.
页面中: <input type="button" value="test" onclick="javasctipt:testOnclick(event)">

javasctipt中的代码

function testOnclick(evt){
evt = evt ? evt : (window.event ? window.event : null);
}


3)关于Array的indexOf方法问题
Array是object对象,有些浏览器不支持idsArray.indexOf(..),这个方法也不是javascript标准,用循环可以拿到最正确的值

4)页面调用框架中的方法问题
比如有个 A.html,他包含了B.html; B.html有个 test()方法,有个button,按button就触发test方法
写法:<input type="button" value="test" onclick="top.B.test()"/>
如果用<input type="button" value="test" onclick="test()"/>在firefox上会不起作用

5)window.top.BB.document.getElementById("BFrame") 和window.top.BB.BFrame的不同 BB,BFrame是frame的name的value
window.top.frames["BB"].document.getElementById("BFrame")==window.top.BB.document.getElementById("BFrame") 结果是true,他们是同一对象
window.top.frames["BB"].document.getElementById("BFrame")==window.top.BB.BFrame 结果是 false,说明他们是不同的对象

window.top.BB.BFrame 是object window
window.top.frames["BB"].document.getElementById("BFrame")和window.top.BB.document.getElementById("BFrame")是objectHTMLFrameElement
他们在删除的时候也不一样,
object window拿到的是window对象,要删除两次才可以删掉,有时还会报错
objectHTMLFrameElement是页面中的frame元素,删一次就可以完全删除了,注意这样的删除只是指向了null,而objectHTMLFrameElement元素还是存在的


(三)初始化问题
在使用对象的时候,尽可能在使用前初始化,这样可以避免一些加载问题

(四)其他问题:
下面的代码用于屏蔽firefox鼠标右键
<script type="text/javascript">
document.oncontextmenu=function(e){return false;}
</script>
关于禁止选择:
在IE下,禁止用户选择内容,用脚本可以实现:
<script>
document.onselectstart = function(){return false;}
</script>或
<body onselectstart="return false">


在firefox,这样子的写法没法实现相同的功能,不过可能用css实现:
在页面加上
<style>
html *{-moz-user-select: none;}
</style>


例子:
<style>
html *{-moz-user-select: none;}
</style>
<body>
试试看能否选择这些文字?
</body>


鼠标右键事件
页面中:
<input type="button" value="test" onclick="javasctipt:test(event)">


javasctipt中的代码
function test(evt) {

//alert("evt:NEW "+evt);

if(typeof window.ActiveXObject != 'undefined') { // 支持IE浏览器
//alert("支持IE浏览器");
//遨游的鼠标右健是0,GB的鼠标右健是2
if ((event.button==2 ||event.button==0)&&text!="首页")
//dosomething
}else{
//alert("支持MF浏览器");
evt = evt ? evt : (window.event ? window.event : null);
var rightnum=evt.button;//鼠标右键的值为2,兼容IE和FF
if(rightnum==2){
//dosomething
}


}

}
阅读更多

没有更多推荐了,返回首页