事件处理程序中的代码执行时,有权访问全局作用域中任何代码。

 //为按钮btn_event添加了两个个事件处理程序,而且该事件会在冒泡阶段触发(最后一个参数是false)。
var btn_event = document.getElementById("btn_event");
var handler = function () {
alert(this.id);
};
var handler2 = function () {
alert("hello longdb");
};
btn_event.addEventListener("click", handler, false);
btn_event.addEventListener("click", handler2, false); //移出第二个事件处理程序。
btn_event.removeEventListener("click", handler2, false);//第二个参数传入handler2函数才有效。

IE事件处理程序:

   //移出第二个事件处理程序。
btn_event.removeEventListener("click", handler2, false);//第二个参数传入handler2函数才有效。 // IE事件处理程序。IE实现了与DOM中类似的两个方法:
//执行顺序与DOM的addEventListener相反。
btn_event.attachEvent("onclick", handler);
btn_event.attachEvent("onclick", handler2); //移出第一个事件处理程序。
btn_event.detachEvent("onclick",handler);

垮浏览器事件处理程序:

   //垮浏览器的事件处理程序。
var EventUtil = {
addHandler: function (element, type, handler) {
if (element.addEventListener) {
element.addEventListener(type, handler, false);
}
else if (element.attachEvent) {
element.attachEvent("on" + type, handler);
}
else {
element["on" + type] = handler;
}
},
removeEventListener: 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){
return event ? event : window.event;
}
,
getTarget: function (event){
return event.target || event.srcElement;
}
,
preventDefault: function (event) {
if (event.preventDefault) {
return event.preventDefault;
}
else {
return event.returnValue = false;
}
}
}; //这样利用上面的对象。
EventUtil.addHandler(btn_event, "click", handler);
EventUtil.addHandler(btn_event, "click", handler2);
EventUtil.removeEventListener(btn_event, "click", handler2);//移出handler2事件处理程序。

HTML事件处理程序的更多相关文章

  1. KnockoutJS 3.X API 第七章 其他技术(5) 使用其他事件处理程序

    在大多数情况下,数据绑定属性提供了一种干净和简洁的方式来绑定到视图模型. 然而,事件处理是一个常常会导致详细数据绑定属性的领域,因为匿名函数通常是传递参数的推荐技术. 例如: <a href=& ...

  2. 深入理解DOM事件机制系列第二篇——事件处理程序

    × 目录 [1]HTML [2]DOM0级 [3]DOM2级[4]IE[5]总结 前面的话 事件处理程序又叫事件侦听器,实际上就是事件的绑定函数.事件发生时会执行函数中相应代码.事件处理程序有HTML ...

  3. JavaScript事件对象与事件处理程序

    在学习之前建议请看一下事件流.事件冒泡.事件捕获 一.事件对象 事件对象:在DOM触发事件时,会产生一个事件对象event,这个事件对象包含着所有与事件相关的信息.既然event是事件对象,那么它必然 ...

  4. JS事件-事件处理程序-笔记总结ing...

    html事件处理程序:缺点-行为与结构耦合<input type="button" onclick = "diaoyong();"> dom0级事件 ...

  5. JavaScript事件处理程序

    JavaScript中的事件处理程序主要分为3种: HTML事件处理程序: <script type="text/javascript"> // HTML事件处理程序 ...

  6. JS:事件处理程序

    在JQuery中有个toggle事件,可以绑定两个或多个函数,可以轮流相应click事件,这两天学习到原来javascript中有两个方法(也可以说是四个)同样可以实现这个功能. #box{ marg ...

  7. js 事件处理程序 事件对象

    事件:用户或浏览器自身执行的动作: 事件处理程序:响应某个事件的函数: 事件流:从页面中接收事件的顺序. 1.DOM事件流 "DOM2级事件"规定的事件流包括三个阶段:事件捕获阶段 ...

  8. javaScript事件(二)事件处理程序

    一.事件 二.事件流 以上内容见:javaScript事件(一)事件流 三.事件处理程序 前面提到,事件是用户或浏览器自身执行的某种动作,如click,load和mouseover都是事件的名字.响应 ...

  9. JavaScript:关于事件处理程序何时可以直接访问元素的属性

    指定在元素的的事件处理程序中指定 <input type="button" value="click me" onclick="alert(th ...

  10. 探究JavaScript中的五种事件处理程序

    探究JavaScript中的五种事件处理程序 我们知道JavaScript与HTML之间的交互是通过事件实现的.事件最早是在IE3和Netscape Navigator 2中出现的,当时是作为分担服务 ...

随机推荐

  1. [BZOJ1036] [ZJOI2008] 树的统计Count (LCT)

    Description 一棵树上有n个节点,编号分别为1到n,每个节点都有一个权值w.我们将以下面的形式来要求你对这棵树完成一些操作: I. CHANGE u t : 把结点u的权值改为t II. Q ...

  2. 打印Java异常堆栈信息

    背景 在开发Java应用程序的时候,遇到程序抛异常,我们通常会把抛异常时的运行时环境保存下来(写到日志文件或者在控制台中打印出来).这样方便后续定位问题. 需要记录的运行时环境包含两部分内容:抛异常时 ...

  3. nginx学习之rewrite

    rewrite 语法学习 什么是rewrite nginx的rewrite主要功是实现URL地址重写.nginx的rewrite规则需要PCRE的支持,既可以通过Perl兼容正则表达式进行规则匹配.n ...

  4. RHEL7 网卡绑定

     //bond(主要用于6系统) nmcli connection add type bond mode balance-rr con-name bond0 ifname bond0 ipv4.met ...

  5. 学习笔记-C++ STL iterator与对指针的理解-20170618

    vector的itrerator支持random access #include<iostream> #include<vector> using namespace std; ...

  6. cookie 的增加,销毁,读取

    <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" ...

  7. 100个命令Linux常用命令大全

    Linux常用命令大全100条: 1,echo "aa" > test.txt 和 echo "bb" >> test.txt//>将原 ...

  8. SIMD---SSE系列及效率对比

    SSE(即Streaming SIMD Extension),是对由MMX指令集引进的SIMD模型的扩展.我们知道MMX有两个明显的缺点: 只能操作整数. 不能与浮点数同时运行(MMX使用FPU寄存器 ...

  9. 笔记:Hibernate 二级缓存

    Hibernate 包括二个级别的缓存,默认的总是启用Session级别的一级缓存,可选的 SessionFactory 级别的二级缓存,Session级别的一级缓存,但应用保存持久化实体.修改持久化 ...

  10. 手写ButterKnife

    开发中使用注解框架可以极大地提高编码效率,注解框架用到的技术可以分为两种,运行时注解跟编译时注解.运行时注解一般配合反射机制使用,编译时注解则是用来生成模板代码.这里我们分别使用这两种方法实现Butt ...