javascript事件处理程序详解。

事件处理程序:

addEventListener();

document对象和所有文档元素都定义了一个名叫addEventListener()方法,使用这个方法人可以为事件目标注册事件处理程序。接收三个参数,第一是要注册处理程序的事件类型,可以是字符串或名字,但不可以带处理程序属性的on前缀。第二是指定类型的事件发生时调用的函数。第三是布尔值,一般会给这个参数为false,如果为true,那么函数将注册为捕获事件处理,并在事件不同的调度阶段调用。

使用:
IE8及以下版本不支持。

<button id='myBut'>点击</button>
var b  = document.getElementById('myBut');
b.onclick = function(){
 console.log(1);
}
b.onclick = function(){
 console.log(2);   //  点击只会打印2
}
<button id='myBut'>点击</button>
var b  = document.getElementById('myBut');
b.onclick = function(){
 console.log(1);
}
b.addEventListener('click'',function(){     // 事件名称不带on
 console.log(2);   //  1   2  都打印 而且顺序不会变
},false)

removeEventListener();

同样有三个参数。第一参数要移除的事件名,第二要移除的函数,第三默认fasle。
用法与addEventListener()相同。

attachEvent();
与addEventListener()类似,不过事件名要加on,它只有两个参数,允许相同的事件处理程序函数注册多次。

detachEvent();
与removeEventListener()类似。使用与attachEvent()相同。

事件处理程序的作用域。

定义时的作用域而非调用时的作用域中执行。因此事件处理程序想调用Window对象就必须带window,而不是直接写属性名。

事件处理程序的返回值。

返回值false就是告诉浏览器不要执行这个事件相关的默认操作。

调用顺序。
通过设置对象属性或HTML属性注册的处理程序一直优先调用。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值