码迷,mamicode.com
首页 > 编程语言 > 详细

javascript--事件

时间:2017-12-13 00:04:06      阅读:195      评论:0      收藏:0      [点我收藏+]

标签:javascript事件

技术分享图片  event概念及作用

在触发DOM上某个事件时,会产生一个事件对象event,这个对象包含着所有事件相       关的信息,包含导致事件的元素,事件的类型以及其他的与特定事件相关的信息。

n  它是事件绑定中的一个隐藏的参数,可以通过arguments[0]来获取

n  也可以叫事件源对象,这里面包含了关于这次事件的相关信息

技术分享图片  获取方式(兼容问题)

n  在W3C标准中,直接在函数中声明该参数即可

btn.onclick = function(event) {

//这里就可以使用了

};

n  兼容性写法,支持老版本的IE

var ev = ev ? ev : window.event;

var ev = ev || window.event;

技术分享图片  event.button属性介绍

alert(event.button);     alert(ev.which);

//如果当前event是鼠标事件,则会有一个button属性,它是一个数字

0代表鼠标按下了左键 ||  1代表按下了滚轮  ||  2代表按下了右键

n  不过老版本的IE并没有遵守W3C的规范,它的button属性含义如下

n  onmousedown/onmouseup 

1鼠标左键 2鼠标右键 3左右同时按 4滚轮 5左键加滚轮 6右键加滚轮 7三个同时

n  目前IE11.0版本,无兼容性问题

技术分享图片  鼠标事件中获取鼠标的位置属性介绍(兼容问题)

     技术分享图片

event.clientX鼠标相对于浏览器窗口可视区域的X坐标(窗口坐标),可视区域不包括工具栏和滚动条。

event.pageX类似于event.clientX,但它们使用的是文档坐标而非窗口坐标。(ie8及以下不支持)

event.offsetX鼠标相对于事件源元素(srcElement)的X坐标。

event.screenX鼠标相对于用户显示器屏幕左上角的X,Y坐标。

技术分享图片  键盘事件(keyup、keydown、keypress)

技术分享图片  组合键ctrlKey、altKey、shiftKey

if(event.keyCode == 13 && event.ctrlKey) {

//发送消息

}

技术分享图片  keyCode/which兼容

event.keyCode || event.which

alert(event.which); //IE不支持(ie8)

技术分享图片  事件的冒泡(事件从子节点向上依次传递给父节点

IE 的事件流叫做事件冒泡(event bubbling) ,即事件开始时由最具体的元素(文档中嵌套       层次最深的那个节点)接收,然后逐级向上传播到较为不具体的节点(文档) 


javascript--事件

标签:javascript事件

原文地址:http://blog.51cto.com/13507333/2049989

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!