1、鼠标事件
onclick
鼠标点击事件，当鼠标左键点击时候会触发。
ondbclick
当鼠标双击时候会触发，并有一个时间间隔，但不能太大。
onmousedown
鼠标按下事件，当鼠标左中右键（鼠标左键，鼠标滚轮，鼠标右键）按下（按下没有抬起）的时候触发
onmouseup
鼠标抬起事件，当鼠标左中右键抬起时候触发
onmousemove
鼠标移动事件，当鼠标移动到目标元素上就会触发，并会按照一定频率去触发
onmouseover
鼠标移入事件，当鼠标移入到目标元素上就会触发
onmouseout
鼠标移出事件，当鼠标从目标元素上移开的时候就会触发
onmouseenter
鼠标移入事件，当鼠标移入到元素身上就会触发
onmouseleave
鼠标移出事件，当鼠标从元素身上移出的时候触发
注：onmouseover / onmouseout 与 onmouseenter / onmouseleave区别
onmouseover / onmouseout 事件，目标元素如果有子级元素的话，它会把事件传递给子集元素
onmouseenter / onmouseleave 事件，目标元素如果有子集元素，事件不会被传递给子集元素
2、键盘事件
onkeydown
当键盘按下去的时候会触发，如果键盘没有抬起来，那这个事件会一直触发。
onkeyup
当键盘按钮抬起来的时候触发。
onkeypress
当键盘按下数字键或字母键可以触发，功能键除外（上下左右、ctrl、shift、alt）。
3、焦点事件
onfocus
当有焦点的元素获取到焦点时候触发（用tab键也会触发这个事件）
onblur
当有焦点的元素失去焦点时候触发
注：支持onfocus的对象
button、checkbox、fileUpload、layer、frame、password、radio、reset、select、submit、text、textarea、window。
4、滚轮事件
onmousewheel（IE/Chrom）：
滚轮方向（event.wheelDelta）上：120；下：-120。
DOMMouseScroll (FF,FF下只能用addEventListener)：
滚轮方向（event.detail）上：-3；下：3。
封装的滚轮事件
**********************************************************
function mScroll(obj,callBackUp,callBackDown){
obj.onmousewHeel=fn;
obj.addEventListener('DOMMouseScroll',fn);
function fn(ev){
if(ev.wheelDelta==120||ev.detail==-3){
//这个条件成立说明鼠标都是往上滚动的
callBackUp();
}else{
//这个条件成立说明鼠标都是往下滚动的
callBackDown();
}
ev.preventDefault();
}
}
***************************************************************************
调用函数
var text=document.getElementById('text');
mScroll(text,function(){
text.value++;
},function(){
text.value--;
});
网友评论