javascript event在FF和IE的兼容传参心得(绝对好用)
event在IE和FF不兼容,今天传参碰到些问题,参考网上的一些方法,有所心得:
aClassArray[i].onmouseover=function(){//代码直接写在里面是可以的,要传参也可以传,只是不方便复用}; aClassArray[i].onmouseover=linkMouseover//不传参的情况下是可以用的,但后续不能用arguments.callee.caller.arguments[0] aClassArray[i].onmouseover=linkMouseover()//加括号是错误用法 aClassArray[i].onmouseover=function(){linkMouseover(this)};//this能传进去,可以alert出来,但evt.clientX+"px"就出问题了,是空的。。。arguments.callee.caller.arguments[0]//可以用这个解决 varsrc=evt.srcElement||evt.target;//后续还可以跟src
===========================================================================
附上练习代码
<!DOCTYPEhtml> <html> <head> <title></title> <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <linkrel="stylesheet"href="css/ui-lightness/jquery-ui-1.10.4.custom.css"rel="externalnofollow"/> <scriptsrc="js/jquery-1.10.2.js"></script> <scriptsrc="js/jquery-ui-1.10.4.custom.js"></script> <styletype="text/css"> .aClass,.aClass:visited{ font-size:36px; text-decoration:none; color:#0094ff; } .divTips{ font-size:20px; color:red; border:#f001pxsolid; position:absolute; width:100px; height:30px; } </style> <scripttype="text/javascript"> functioninitOnOver(){ vartitleTips={ "baidu":"百度网站提示", "163":"163网站提示", "google":"google网站提示" } varaTag=document.getElementsByTagName("a"); varaClassArray=[]; for(vari=0;i<aTag.length;i++){ if(aTag[i].className=="aClass"){ aClassArray[aClassArray.length]=aTag[i]; } } for(vari=0;i<aClassArray.length;i++){ vare; aClassArray[i].onmouseover=function(){linkMouseover()}; aClassArray[i].onmouseout=linkMouseout; } } functionlinkMouseover(){ vardivTips=document.createElement("div"); varevt=window.event||arguments.callee.caller.arguments[0];//获取event对象 divTips.className="divTips"; divTips.style.left=evt.clientX+"px";//+px兼容FF divTips.style.top=evt.clientY+"px";//+px兼容FF divTips.innerHTML="test"; document.getElementById("divA").appendChild(divTips); } functionlinkMouseout(){ vardivTag=document.getElementsByTagName("div"); for(vari=0;i<divTag.length;i++){ if(divTag[i].className=="divTips"){ document.getElementById("divA").removeChild(divTag[i]); } } } window.onload=initOnOver; </script> </head> <body> <divid="divA"> <ahref="http://www.baidu.com"rel="externalnofollow"class="aClass">百度</a> <br/> <br/> <br/> <ahref="http://www.163.com"rel="externalnofollow"class="aClass">网易</a> <br/> <br/> <br/> <ahref="http://www.google.com"rel="externalnofollow"class="aClass">Google</a> </div> </body> </html>