[转载]IE6.0 Firefox 2 兼容问题积累

来源:互联网 发布:姓名随机抽取软件 编辑:程序博客网 时间:2024/04/20 05:19
一.屏蔽用户Enter键
    ,所 以这里就有了不同的处理方法,很多页面上需要屏蔽用户采用Enter键来执行动作,尤其是Struts中,如果对一个Text框出发Enter事件并采用 Submit提交,经常会出现问题,所以可以用以下的方式将其屏蔽掉,或者对于单独Text框做一个移动焦点的动作也可以。
js 代码
  1. //键盘Enter事件屏蔽      
  2. function onEnterClick(event){      
  3.     var eventObj=(event==null) ? window.event : event;      
  4.       
  5.     var keyCode = (eventObj.which) ? eventObj.which : eventObj.keyCode;      
  6.       
  7.     if(keyCode == 13){      
  8.         return false;      
  9.      }else{      
  10.         return true;      
  11.      }      
  12. }

HTML页面调用时直接使用onkeydown方法触发onEnterClick(event)即可

这样就可以屏蔽掉,主要是两个差别:

      A.event的获得方式   IE和Firefox下不同,由于IE和Opera把页面事件做为全局变量,直接用window.event就可以访问,而Firefox只有在出发事件 的时候才能访问event,所以第三行代码就是针对不同浏览器获得event

      B.keycode的获得方式 (信息来源地址:http://blog.tianya.cn/blogger/post_Date.asp?BlogID=666817&idWriter=0&Key=0&month=10&year=2006) 、Opera 只支持keyCode属性,当事件是keydown和keyup时,keyCode属性返回的是数字代号,当事件是keypress时返回的是 unicode字符。 而Firefox为keydown和keyup事件设了keyCode属性,为keypress事件设了CharCode属性。返回的结果同IE、 Opera。IE

二、判断浏览器的方式:

     这个东西在使用RIA框架之前还是满有用的,现在看来自己写这个东西麻烦、容易错,但是有助于了解IE和Firefox的差别(所以这个需要不断的积累):

    1.isMSIE = (navigator.appName == "Microsoft Internet Explorer");

     2.isFirefox= (window.event==null);

三、eventElement:

js 代码
  1. function getEventElement (event){      
  2.     if(event == null){      
  3.          event = window.event;      
  4.      }       
  5.     return (event.srcElement ? event.srcElement : event.target);      
  6. }  

       这里面的区别关键点:

       A.event,同上面所述

       B.获得对象方面,IE是event.srcElement,Firefox是event.target,Opera是两个都支持

四、获得相对坐标

js 代码
  1. function getLeft(obj){   
  2.     if(isMSIE){   
  3.        value = obj.style.pixelLeft;   
  4.      }else{   
  5.        value = parseInt(obj.style.left, 10);   
  6.      }   
  7.     return value;   
  8. }  

      在Firefox下面没有style.pixelLeft属性,取而代之的是style.left这种parseInt的处理方法,同样的处理适用于top属性

五、透明度

js 代码
  1. function setOpcity(obj,value){   
  2.     // alpha(opacity=50)仅被IE支持      
  3.     if(isMSIE){   
  4.        obj.style.filter="alpha(opacity="+value+")";   
  5.      }else{   
  6.        obj.style.MozOpacity=value*0.01;   
  7.      }   
  8. }  

     这个透明度两款浏览器显示处理方式有着很大的不同,估计再多来几种浏览器也会不同。

六、对于相对坐标的处理

js 代码
  1. if(dragElement.parentNode.tagName != "BODY"){      
  2.         // 当选中可拖动元素时,初始化拖动元素的初始位置      
  3.          dragElement.style.left = (dragElement.offsetLeft + getLeft(dragElement.parentNode)) + "px";      
  4.          dragElement.style.top = (dragElement.offsetTop + getTop(dragElement.parentNode))+ "px";      
  5.      }     
       请注意每行后面都加了"px"单位,由于Firefox在这方面要比IE更加严格,如果没有添加单位,Firefox就会发生错误,而在IE里面运行良好,估计国内网站对Firefox的不兼容这个问题占了相当大的比例。
 
原创粉丝点击