JavaScript常用事件总结归纳

---

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--;

});