源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

JavaScript中的跨浏览器事件操作的基本方法整理

  • 时间:2022-07-02 06:37 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:JavaScript中的跨浏览器事件操作的基本方法整理
[b]绑定事件 [/b]
EU.addHandler = function(element,type,handler){
  //DOM2级事件处理,IE9也支持
  if(element.addEventListener){
    element.addEventListener(type,handler,false);
  }
  else if(element.attachEvent){
    //type加'on'
    //IE9也可以这样绑定
    element.attachEvent('on' + type,handler);
  }
  //DOM0级事件处理步,事件流也是冒泡
  else{
    element['on' + type] = handler;
  }
};
[b]取消绑定事件 [/b]和绑定事件的处理基本一致,有一个注意点: 传入的handler必须与绑定事件时传入的相同(指向同一个函数)
EU.removeHandler = function(element,type,handler){
  if(element.removeEventListener){
    element.removeEventListener(type,handler);
  }
  else if(element.attachEvent){
    element.detachEvent('on' + type,handler);
  }
  else{
    //属性置空就可以
    element['on' + type] = null;
  }
};
[b]跨浏览器添加事件 [/b]
  function addEvent(obj,type,fn){
    if(obj.addEventListener){
      obj.addEventListener(type,fn,false);
    }else if(obj.attachEvent){//IE
      obj.attchEvent('on'+type,fn);
    }
  }
[b]    跨浏览器移除事件 [/b]
function removeEvent(obj,type,fn){
  if(obj.removeEventListener){
    obj.removeEventListener(type,fn,false);
  }else if(obj.detachEvent){//兼容IE
    obj.detachEvent('on'+type,fn);
  }
}
[b]跨浏览器阻止默认行为 [/b]
function preDef(ev){
    var e = ev || window.event;
    if(e.preventDefault){
      e.preventDefault();
    }else{
      e.returnValue =false;
    }
  }
[b]    跨浏览器获取目标对象 [/b]
function getTarget(ev){
  if(ev.target){//w3c
    return ev.target;
  }else if(window.event.srcElement){//IE
    return window.event.srcElement;
  }
}  
[b]跨浏览器获取滚动条位置 [/b]
//跨浏览器获取滚动条位置,sp == scroll position
  function getSP(){
    return{
      top: document.documentElement.scrollTop || document.body.scrollTop,
      left : document.documentElement.scrollLeft || document.body.scrollLeft;
    }
  }
[b]跨浏览器获取可视窗口大小 [/b]
     function getWindow () {
      if(typeof window.innerWidth !='undefined') {
        return{
          width : window.innerWidth,
          height : window.innerHeight
        }

      } else{
        return {
          width : document.documentElement.clientWidth,
          height : document.documentElement.clientHeight
        }
      }
    },

       
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部