首页 > 代码库 > JS事件入门学习
JS事件入门学习
每当发生事件,浏览器就会产生一个事件对象,用来保存与事件有关的一些信息
IE,chrome 支持 window.event,而FF不支持,兼容写法如下:
xxx.onclick =function(evt){ //这里的evt可以改成event,e,下面相应的要对应
var e = evt || window.event;
}
对于鼠标事件,event对象里面的button属性,表示按下或释放按钮。
w3c浏览器和IE浏览器保存的数据有点不同,所以 我们只兼容的获取当前点击的是左键,中键还是右键
function getButton(evt) { //跨浏览器左中右键单击相应
var e = evt || window.event;
if (evt) { //Chrome 浏览器支持 W3C 和 IE
return e.button; //要注意判断顺序,W3C一次返回0,1,2
} else if (window.event) {
switch(e.button) { //因为IE浏览器一次返回1,4,2,所以要修改成和w3c一样的数据
case 1 :
return 0;
case 4 :
return 1;
case 2 :
return 2;
}
}
}
可视区及屏幕坐标
事件对象提供了两组来获取浏览器坐标的属性, 一组是页面可视区左边, 另一组是屏幕坐标
clientX 可视区 X 坐标,距离左边框的位置
clientY 可视区 Y 坐标,距离上边框的位置
screenX 屏幕区 X 坐标,距离左屏幕的位置
screenY 屏幕区 Y 坐标,距离上屏幕的位置
键盘事件:
shiftKey 判断是否按下了 Shfit 键
ctrlKey 判断是否按下了 ctrlKey 键
altKey 判断是否按下了 alt 键
键码:
在发生 keydown 和 keyup 事件时,event 对象的 keyCode 属性中会包含一个代码,与键盘上一个特定的键对应。对数字字母字符集,keyCode 属性的值与 ASCII 码中对应小写字母或数字的编码相同。
不同的浏览器在 keydown 和 keyup 事件中,会有一些特殊的情况:
在 Firefox 和 Opera 中,分号键时 keyCode 值为 59,也就是 ASCII 中分号的编码;而 IE和 Safari 返回 186,即键盘中按键的键码。
JS事件入门学习