通用事件对象(跨浏览器)

var EventUtil = {
        addHander: function(element, type, handler) {
            if (element.addEventListener) {
                element.addEventListener(type, handler, false)
            } else if (element.attchEvent) {
                element.attchEvent(‘on‘ + type, handler)
            } else {
                element[‘on‘ + type] = handler
            }
        },
        removeHandler: function(element, type, handler) { //取消事件
            if (element.removeEventListener) {
                element.removeEventListener(type, handler, false);
            } else if (element.detachEvent) {
                element.detachEvent("on" + type, handler);
            } else {
                element["on" + type] = null;
            }
        },
        getEvent: function(event) { //使用这个方法跨浏览器取得event对象
            return event ? event : window.event;
        },
        getTarget: function(event) { //返回事件的实际目标
            return event.target || event.srcElement;
        },
        stopBubble: function stopBubble(event) {
            // 如果提供了事件对象,则这是一个非IE浏览器
            if (event && event.stopPropagation) {
                // 因此它支持W3C的stopPropagation()方法
                event.stopPropagation();
            } else {
                // 否则,我们需要使用IE的方式来取消事件冒泡
                window.event.cancelBubble = true;
            }
        },
        stopDefault: function(event) {
            // 阻止默认浏览器动作(W3C)
            if (event && event.preventDefault) {
                event.preventDefault();
            } else {
                // IE中阻止函数器默认动作的方式
                window.event.returnValue = false;
            }
            return false;
        },
        getWheelDelta: function(event) { //获取表示鼠标滚轮滚动方向的数值
            if (event.wheelDelta) {
                return event.wheelDelta;
            } else {
                return -event.detail * 40;
            }
        },
        getCharCode: function(event) { //以跨浏览器取得相同的字符编码,需在keypress事件中使用
            if (typeof event.charCode == "number") {
                return event.charCode;
            } else {
                return event.keyCode;
            }
        }
    };
时间: 2024-08-23 23:28:37

通用事件对象(跨浏览器)的相关文章

JS-DOM2级事件对象跨浏览器处理(已封装)

1 var eventUill = { 2 //添加事件 3 addHander: function(element, type, handler) { 4 if(element.addEventListener) { 5 element.addEventListener(type, handler, false); 6 } else if(element.attachEvent) { 7 element.attachEvent('on' + type, handler); 8 } else {

js事件对象--DOM中的事件对象/IE中的事件对象/跨浏览器的事件对象

事件对象    在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息.包括导致事件的元素.事件的类型,以及其他与特定事件相关的信息.例如,鼠标操作导致的事件对象中,会包含鼠标位置的信息,而键盘操作导致的事件对象中,会包含与按下的键有关的信息.所有浏览器对象都支持event对象,但支持方式不同. DOM中的事件对象 兼容DOM的浏览器会将一个event对象传入到事件处理程序中.无论指定事件处理程序时使用什么方法(DOM0级或DOM2级),都会传入event

Event对象跨浏览器兼容性写法

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con

BOM学习3--navigator对象跨浏览器检测插件

一,检测插件: 随着互联网的发展,HTML5的标准也成为开发网页的标准,其中比如H5的video标签,就可以直接嵌入到网页成为一个播放器,这就把传统的Flash播放器的功能给取代了.我们在开发不同的项目,可能会依据项目的不同需求,选择使用H5播放器或者Flash插件,这就需要我们在浏览器中识别安装的插件,下面就是一个跨浏览器的插件检测方法: 1,对于非IE浏览器,我们可以直接使用plugins这个数组来遍历插件,下面是数组每一项包含的属性: name: 插件的名字, description:插件

JavaScript中的Event事件对象详解

JavaScript事件[event] 在JavaScript中对于事件来讲,首先,我们需要了解这样几个概念:事件:事件处理程序:事件类型:事件流:事件冒泡:事件捕获:事件对象:浏览器内核:事件绑定:事件方面的性能优化(事件委托.移除事件处理程序):常见的浏览器兼容问题等. 什么是事件event: JavaScript事件是:浏览器.文档(document)窗口中的发生的特定的交互瞬间:而JavaScript和HTML之间的交互行为就是通过事件来触发的. 事件处理程序: 事件处理程序:我们用户在

事件处理之跨浏览器

在浏览器众多的今天,跨浏览器显得尤为重要 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

DOM(十四):代理检测和事件处理(跨浏览器)

一.检测 用于用户代理检测,检测范围包括浏览器引擎.平台.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

EventUtil——跨浏览器的事件对象

前言:什么是EventUtil? 在JavaScript中,DOM0级.DOM2级与旧版本IE(8-)为对象添加事件的方法不同 为了以跨浏览器的方式处理事件,需要编写一段“通用代码”,即跨浏览器的事件处理程序 习惯上,这个方法属于一个名为EventUtil的对象 编写并使用该对象后,可保证处理事件的代码能在大多数浏览器下一致的运行 本文将围绕着EventUtil对象展开,并提供该通用对象代码以作参考分享 文章主要内容参考书籍为<JavaScript高级程序设计>([美]Nicholas C.Z

跨浏览器的事件对象-------EventUtil 中的方法及用法

什么是EventUti----封装好的事件对象 在JavaScript中,DOM0级.DOM2级与旧版本IE(8-)为对象添加事件的方法不同 为了以跨浏览器的方式处理事件,需要编写一段“通用代码”,即跨浏览器的事件处理程序 习惯上,这个方法属于一个名为EventUtil的对象 编写并使用该对象后,可保证处理事件的代码能在大多数浏览器下一致的运行 var EventUtil={ addHandler:function(element,type,handler){ //添加事件 if(element