javasctipt常用事件总结

鼠标事件

onclick

鼠标单击事件

ondblclick

鼠标双击事件

onmouseover

鼠标移入事件

onmouseout

鼠标移出事件

onmousemove

鼠标移动事件

onmousedown

鼠标按下事件 用的较少

onmouseup

鼠标松开事件 用的较少

键盘事件

执行顺序：onkeydown → onkeypress → onkeyup。

onkeydown

按下键事件（包括数字键、功能键）

onkeypress

按下键事件（只包含数字键）

onkeyup

放开键事件（包括数字键、功能键）

表单事件

（1）onfocus事件； 获取焦点触发的事件

（2）onblur事件； 失去焦点触发的事件。

（3）onchange事件； 下拉列表列表项的选中触发的事件是

（4）onselect事件； 单行文本框text或多行文本框textarea的文本时，会触发的事件

具有获得焦点和失去焦点事件的元素有3个：

（1）单行文本框text；

（2）多行文本框textarea；

（3）下拉列表select；

编辑事件

（1）复制事件oncopy；

（2）剪切事件oncut；

（3）粘贴事件onpaste；

页面相关事件

（1）onload（加载事件）； onload事件表示在文档加载完毕再执行的事件

window.onload=function(){

    ……

}

（2）onresize（页面大小事件）；

（3）onerror（出错事件）；

onscroll 事件在元素滚动条在滚动时触发

addEventListener() 方法

element.addEventListener(event, function, useCapture);

第一个参数是事件的类型 (如 "click" 或 "mousedown").

第二个参数是事件触发后调用的函数。

第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。

注意:不要使用 "on" 前缀。 例如，使用 "click" ,而不是使用 "onclick"。

向原元素添加事件句柄

element.addEventListener("click", function(){ alert("Hello World!"); });

向同一个元素中添加多个事件句柄

element.addEventListener("mouseover", myFunction);

element.addEventListener("click", mySecondFunction);

向 Window 对象添加事件句柄

window.addEventListener("resize", function(){

    document.getElementById("demo").innerHTML = sometext;

});

传递参数

element.addEventListener("click", function(){ myFunction(p1, p2); });

removeEventListener() 方法

removeEventListener() 方法移除由 addEventListener() 方法添加的事件句柄:

element.removeEventListener("mousemove", myFunction);

js三大家族:offset scroll client