前端开发js 常用事件总结

js 常用事件总结
事件绑定方法
1.在DOM元素中直接绑定

<button onclick=”alert(‘谢谢支持’)”>按钮</button>

2.对象属性方式

DomObject.onclick = function(){}

3.addEventListener方式( W3C标准 )
添加事件

xxxDomObject.addEventListener(‘click’,function(){});

移除事件

xxxDomObject.removeEventListener(“mousedown”, mouse, false);)

此方法事件名一律不带on，( 即绑在 click，load，change.. 等等 )
绑定事件中的”this”指绑定该事件的对象
执行顺序是按照绑定顺序来的

1.鼠标事件
onclick事件，点击事件( 单击 )
ondbclick事件，鼠标双击事件
onmousedown事件，鼠标按下事件( 鼠标按下没有抬起的时候触发 )
onmouseup事件，鼠标抬起事件( 鼠标按下后抬起时触发 )
onmousemove事件，鼠标移动事件( 鼠标指针移动时触发 )
onmouseover事件，鼠标悬停事件( 鼠标指针移动到元素上时触发,onmouseover 事件支持冒泡 )
onmouseout事件，鼠标移出事件( 当鼠标从目标元素上移开的时候就会触发，如果鼠标指针离开任何子元素，同样会触发 onmouseout 事件 )
onmouseenter事件，鼠标进入事件( 鼠标指针移动到元素上时触发,onmouseenter 事件不支持冒泡 )
onmouseleave事件，鼠标离开事件( 鼠标从元素身上离开的瞬间触发 )
onmousewheel事件，鼠标滚轮事件( Firefox浏览器不支持此事件，Firefox使用”DOMMouseScroll”，只能用addEventListener添加该事件 )
2.键盘事件
onkeydown事件，键盘按下事件( 如果键盘一直在按下没有抬起，就会一直触发该事件 ; 任何按键都可以，包括上下左右、ctrl、shift、alt )
onkeyup事件，键盘抬起事件( 键盘抬起时触发 )
onkeypress事件，键盘按下事件( 只是在数字键和字母键按下时触发，不包括 上下左右、ctrl、shift、alt)
3.windows事件
onload事件，文档加载完触发
onunload事件，当网页被关闭时触发
onselect事件，被选中的时候触发
onchange事件，内容改变时触发
window.onresize事件，窗口尺寸发生变化时触发
window.onscroll事件，滚动条移动时触发
4.表单元素事件
onsubmit事件，当表单被提交时触发
onreset事件，当表单被重置时触发
onfocus事件，获取焦点时触发( 用tab键也会触发该事件 )
onblur事件，失去焦点时触发