调用事件:

//事件对象
//什么是事件对象?在触发dom上的事件是都会产生一个事件对象event。例如鼠标点击的时候,自己就会产生比如点击的类型啊 还要那个元素发出的
//dom 事件对象   type 属性用于获取事件对象, target属性 用于获取事件目标,stopPropagation()方法 阻止事件冒泡 preventDefault阻止事件的默认行为
//IE中的事件对象  type 属性 用于获取事件对象, srcElement属性 用于获取事件目标 cancelBubble属性  用于阻止事件冒泡  设置为true是表示阻止 false表示不阻止
//returnValue  属性 用于阻止事件的默认行为 设置为false的时候表示阻止

// 兼容各个浏览器  跨浏览器事件处理------- 统一进行封装
var EventHandle = {

// element : 元素 , type: 点击事件 ,handle : 实行的方法
    //添加句柄
    addEventHandle: function (element, type, handler) {
        if (element.addEventListener) {
            element.addEventListener(type, handler, false);//---false  //代表冒泡 dom2级
        }
        else if (element.attachEvent) {
            element.attachEvent("on"+type, handler);
        } else {
            element["on" + type] = handler;
        }
    },
    //删除句柄  事件处理不起作用
    removeEventHandle: function (element, type, handler) {
        if (element.removeEventListener) {   // 支持dom2级的事件处理  type是 onclick
            element.removeEventListener(type, handler, false); //---false  //代表冒泡
        }
        else if (element.detachEvent) {
            element.detachEvent("on"+type, handler);  //支持IE  
        } else {
            element["on" + type] = null;// dom0级事件处理   传统的点击事件
        }
    },

//获取事件对象 兼容浏览器的所有对象
    getEvent: function (event) {
        return event ? event : window.event;  //在IE浏览器的低版本中需要的是window.event
    },
    //获取事件类型  是点击呢还是鼠标移动
    getType:function(event){
        return event.type;
    },
    //获取当前的那个元素
    getElement: function (event) {
        return event.target || event.srcElement;
    },
    //阻止事件的默认行为
        : function (event) {
        if (event.preventDefault) {
            event.preventDefault();
        }
        else {
            event.returnValue = false;
        }
    },
    //阻止事件冒泡
    stopPropagation: function (event) {

if (event.stopPropagation) {
            event.stopPropagation();
        }
        else {
            event.cancelBubble = true;
        }
    }
}

javascript 兼容各个浏览器的事件的更多相关文章

  1. javaScript之跨浏览器的事件对象

    跨浏览器的兼容代码 var eventHandler = { addHandler: function(element, type, handler){}, removeHandler: functi ...

  2. Javascript兼容各浏览器的日期转换

    var date = new Date(Date.parse("2015-09-05".replace(/-/g,"/")));'2015-09-05'是无法被 ...

  3. JavaScript 兼容各大浏览器阻止冒泡事件

    JavaScript 兼容各大浏览器阻止冒泡事件 function stopEvent(event) { //阻止冒泡事件 //取消事件冒泡 var e = arguments.callee.call ...

  4. 在javascript中的浏览器兼容问题以及兼容浏览器汇总(默认事件,阻止冒泡,事件监听。。。)以及解决方式详解

    在javascript中常见的浏览器兼容问题,以及解决方式. 在前端工作当中我们遵循这样的原则:渐进增强和优雅降级   渐进增强(progressive enhancement): 针对低版本浏览器进 ...

  5. JavaScript和JQuery中的事件\委托链\事件冒泡\事件捕获,兼容所有浏览器

    有做过北大青鸟培训讲师经验的我,如今在一家公司做技术部经理的职位,发现有很多程序员的基本功相当糟糕,在组织企业内部培训时讲解了一些案例,总结了一些经典代码,希望对自己和有需要的人提供一些帮助吧: Ja ...

  6. JavaScript单线程和浏览器事件循环简述

    JavaScript单线程 在上篇博客<Promise的前世今生和妙用技巧>的开篇中,我们曾简述了JavaScript的单线程机制和浏览器的事件模型.应很多网友的回复,在这篇文章中将继续展 ...

  7. JS获取回车事件(兼容各浏览器)

    一.用到onkeydown获取事件动作, 二.用到键盘对应代码keyCode, 三. var event=arguments.callee.caller.arguments[0]||window.ev ...

  8. JavaScript 图片的上传前预览(兼容所有浏览器)

    功能描述 通过 JavaScript 实现图片的本地预览(无需上传至服务器),兼容所有浏览器(IE6&IE6+.Chrome.Firefox). 实现要点   ● 对于 Chrome.Fire ...

  9. js捕捉浏览器关闭事件-兼容几乎所有浏览器

    很多时候我们都在困扰,如何捕获浏览器关闭事件,网上虽然有很多方法,但都不理想,后来终于找到了一个很好地实现方法,大家可以试试哦,支持几乎所有的浏览器 <script type="tex ...

随机推荐

  1. 大话NoSql

    之前看过一本名叫<<大数据挑战的书>>.里面主要讲了NOSQL的内容,感觉讲得确实不错,今天来又一次温习一下,我们大话NOSQL.说道NOSQL.我们肯定联想到的内容就是Big ...

  2. 【模拟】【HDU1443】 Joseph

    Joseph Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total Sub ...

  3. android如何调用显示和隐藏系统默认的输入法(一)

    1.调用显示系统默认的输入法 方法一. InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_MET ...

  4. Mac下获取AppStore安装包文件路径-取出安装包

    问题描述:我们通过AppStore下载软件的时候想要把安装包保存下来,但是AppStore安装好之后会自动删除安装包,而且安装路径也很难找到. 解决方案: 一.打开活动监视器 二.找storedown ...

  5. <转>golang 并发性能数据

    1.管道chan吞吐极限10,000,000,单次Put,Get耗时大约100ns/op,无论是采用单Go程,还是多Go程并发(并发数:100, 10000, 100000),耗时均没有变化,Go内核 ...

  6. c++网络通信(与服务器通信聊天)和c#网络通信

    c++网络通信(有待整理) 链接:http://pan.baidu.com/s/1i3nMLKT 密码:ksi8 c#网络通信(tcp/udp两部分) TCP发送端: using System; us ...

  7. [Linux]Service mysql start出错(mysql: unrecognized service)解决方法

    service mysql start出错,mysql启动不了,解决mysql: unrecognized service错误的方法如下: [hitony ~]# service mysql star ...

  8. html5学习笔记2

    css3选择器 1.通过元素的关键字,如p,div等 2.通过id属性 3.通过class属性引用 3.1通过class属性引用p标签,如:p.text{}//text样式只适用于p 4.通过任意键引 ...

  9. Cannot initialise keyboard run ./nano-X

    其中之一解决方案为: ./xinit

  10. 安装Ubuntu时的硬盘分区方案 转载

    安装Ubuntu时的硬盘分区方案 http://www.cnblogs.com/shenliang123/p/3196743.html 如果你准备在硬盘里只安装Ubuntu一个操作系统的话,建议你采用 ...