DOM(十四):代理检测和事件处理(跨浏览器)
来源:互联网 发布:c语言问号表达式 编辑:程序博客网 时间:2024/06/05 04:50
一、检测
用于用户代理检测,检测范围包括浏览器引擎、平台、Windows、移动设备和游戏系统等
/**用户代理检测脚本,检测范围包括浏览器引擎、平台、Windows、移动设备和游戏系统*/var client = function(){ //呈现引擎 var engine = { ie:0, //ie gecko:0, //火狐 webkit:0, //chrome和safari khtml:0, //Linux下的Konqueror opera:0, //opera ver:null //完整版本号 }; //浏览器 var browser = { ie:0, firefox:0, safari:0, konq:0, opera:0, chrome:0, ver:null //具体版本号 }; //平台、设备和操作系统 var system = { //操作系统 win:false, mac:false, xll:false, //UNIX //移动设备 iphone:false, ipod:false, ipad:false, ios:false, android:false, nokiaN:false, //诺基亚 winMobile:false, //windows mobile //游戏系统 wii:false, //Wii ps:false //Playstation 3 }; //检测呈现引擎和浏览器 var ua = navigator.userAgent; if(window.opera) { engine.ver = browser.ver = window.opera.version(); engine.opera = browser.opera = parseFloat(engine.ver); } else if(/AppleWebkit\/(\S+)/.test(ua )) { engine.ver = RegExp["$1"]; engine.webkit = parseFloat(engine.ver); //确定是chrome还是safari if(/Chrome\/(\S+)/.test(ua)) { browser.ver = RegExp["$1"]; browser.chrome = parseFloat(browser.ver); } else if(/Version\/(\S+)/.test(ua)) { browser.ver = RegExp["$1"]; browser.safari = parseFloat(browser.ver); } else { // 近似确定版本号 var safariVersion = 1; if(engine.webkit < 100) { safariVersion = 1; } else if(engine.webkit < 312) { safariVersion = 1.2; } else if(engine.webkit < 412) { safariVersion = 1.3; } else { safariVersion = 2; } browser.safari = browser.ver = safariVersion; } } else if(/KHTML\/(\S+)/.test(ua) || /Konqueror\/([^; ]+)/.test(ua)) { engine.ver = browser.ver = RegExp["$1"]; engine.khtml = browser.konq = parseFloat(engine.ver); } else if (/rv:([^\)]+)\) Gecko\/\d{8}/.test(ua)) { engine.ver = RegExp["$1"]; engine.gecko = parseFloat(engine.ver); // 确定是不是FireFox if(/firefox\/(\S+)/test(ua)) { browser.ver = RegExp["$1"]; browser.firefox = parseFloat(engine.ver); } } else if(/MISE ([^; ]+)/.test(ua)) { engine.ver = browser.ver = RegExp["$1"]; engine.ie = browser.ie = parseFloat(engine.ver); } // 检测浏览器 browser.ie = engine.ie; browser.opera = engine.opera; // 检测平台 var p = navigator.platform; system.win = p.indexOf("Win") == 0; system.mac = p.indexOf("Mac") == 0; system.xll = (p == "xll") || (p.indexOf("Linux") == 0); // 检测windows操作系统 if(system.win) { if(/Win(?:dows )?([^do]{2})\s?(\d+\.\d+)?/.test(ua)) { if(RegExp["$1"] == "NT") { switch(RegExp["$2"]) { case "5.0": system.win = "2000"; break; case "5.1": system.win = "XP"; break; case "6.0": system.win = "Vista"; break; case "6.1": system.win = "7"; break; default: system.win = "NT"; break; } } else if(RegExp["$1"] == "9x") { system.win = "ME"; } else { system.win = RegExp["$1"]; } } } // 移动设备 system.iphone = ua.indexOf("iPhone") > -1; system.ipod = ua.indexOf("iPod") > -1; system.ipad = ua.indexOf("iPad") > -1; system.nokiaN = ua.indexOf("NokiaN") > -1; // windows mobile if(system.win == "CE") { system.winMobile = system.win; } else if(system.win == "Ph") { if(/Windows Phone OS (\d+.\d+)/.test(ua)) { system.win = "Phone"; system.winMobile = parseFloat(RegExp["$1"]); } } // 检测IOS版本 if(system.mac && ua.indexOf("Mobile") > -1) { if(/CPU (?:iPhone )?OS (\d+_\d+)/.test(ua)) { system.ios = parseFloat(RegExp.$1.replace("_",".")); } else { system.ios = 2; } } // 检测Android if(/Android (\d+\.\d+)/.test(ua)) { system.android = parseFloat(RegExp.$1); } // 游戏系统 system.wii = ua.indexOf("Wii") > -1; system.ps = /playstation/i.test(ua); // 返回结果 return { engine:engine, browser:browser, system:system };}();
二、事件的跨浏览器处理
/**参数:ele-->元素,type-->事件类型,不带on,handler-->事件处理程序*/ var EventHandler = { addHandler:function(ele,type,handler){ //添加处理程序 // DOM2级事件处理 if(ele.addEventListener){ ele.addEventListener(type,handler,false); }else if(ele.attachEvent){ ele.attachEvent("on"+type,handler); }else{ // DOM0级事件处理 ele["on"+type] = handler; } }, removeHandler:function(ele,type,handler){ //删除处理程序 if(ele.removeEventListener){ ele.removeEventListener(type,handler,false); }else if(ele.detachEvent){ ele.detachEvent("on"+type,handler); }else{ ele["on"+type] = null; } },
getEvent:function(event){ //获取事件对象
return event?event:window.event;
},
getTarget:function(event){ //获取事件目标
return event.target || event.srcElement;
},
preventDefault:function(event){ //阻止事件默认行为
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue = false;
}
},
stopPropagation:function(event){ //阻止事件流
if(event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble = true;
}
},
getRelatedTarget:function(event){ //在mouseover和mouseout中获取相关元素
if(event.relatedTarget){
return event.relatedTarget;
}else if(event.toElement){ //IE8及以下版本不支持relatedTarget属性
return event.toElement;
}else if(event.fromElement){
return event.fromElement;
}else{
return null;
}
},
getWheelDelta:function(event){ //获取鼠标滚轮数据
if(event.wheelDelta){
return (client.engine.opera && client.engine.opera < 9.5?-event.wheelDelta:event.wheelDelta);
}else{
return –event.detail*40; //针对FireFox
}
},
getCharCode:function(event){ //获取字符编码
if(event.charCode == “number”){
return event.charCode;
}else{
return event.keyCode;
}
},};
存在的不足之处敬请见谅。
原文首发:http://www.ido321.com/1403.html
- DOM(十四):代理检测和事件处理(跨浏览器)
- DOM事件处理跨浏览器(兼容IE)封装
- 解决跨浏览器DOM事件处理
- javaScript笔记(十四) 浏览器检测
- javascript 句柄 --DOM事件处理及跨浏览器处理
- js--DOM(事件处理)
- DOM 事件处理(收集)
- DOM 2级事件模型跨浏览器处理
- JS的Dom和事件处理机制( 一)
- JS的Dom和事件处理机制( 二)
- JS的Dom和事件处理机制(三)
- 跨浏览器的事件处理(套装)
- DOM事件之跨浏览器
- 事件处理程序和跨浏览器的事件处理程序
- 【OpenCV图像处理】二十四、霍夫(Hough)检测
- DOM和IE跨浏览器的事件对象
- DOM事件(事件流、事件处理程序)
- 跨浏览器事件处理程序及跨浏览器事件对象(事件笔记)
- android背景选择器selector用法汇总
- MyEclipse8.5集成Tomcat7时的启动错误:Exception in thread “main” java.lang.NoClassDefFoundError
- 深入理解Android(5)——从MediaScanner分析Android中的JNI
- Ext.get()与Ext.fly()之区别
- windows应用程序开发系列五:注册窗口类
- DOM(十四):代理检测和事件处理(跨浏览器)
- Android中加标题的背景和文字并且添加返回
- 对KMP的理解,以及kmp算法java版本实现
- mysql主从配置过程记录
- UVa 11269 - Setting Problems (贪心)
- 算法递进笔记之农场牛生牛问题算法及内存解析
- SpringMVC使用进阶-文件上传
- C++ 引用、const指针
- 忆布鞋院士--李小文