JavaScript鼠标键盘事件

谁践踏了优雅 2022-05-26 12:06 295阅读 0赞

**鼠标事件**

onclick    当用户点击某个对象时调用的事件句柄

oncontextmenu    在用户点击鼠标右键打开上下文菜单时触发

ondblclick    当用户双击某个对象时调用的事件句柄

onmousedown    鼠标按钮被按下

onmouseup    鼠标按键被松开

onmousemove    鼠标移动时

onmouseover    当鼠标指针移动到指定元素上时

onmouseout    当鼠标指针移出指定元素上时

onmouseenter    当鼠标指针移动到指定元素上时

onmouseleave    当鼠标指针移出指定元素上时

onmouseover onmouseout 和 onmouseenter onmouseleave 的功能是一样的，

不同的是 onmouseover onmouseout这两个会触发冒泡事件，而另外两个不会

**键盘事件**

keydown    当键盘按下执行一段Javascript

keyup          当键盘抬起执行一段Javascript

keypress     当键盘按下并被松开执行一段Javascript

**这三个事件的触发顺序：**

keydown -->keypress  -->keyup

**keydown 和 keypress 的区别**

keydown 可以响应任意键盘按键，keypress只可以响应字符类键盘按键。

keydown 获取字符类按键不精确。

**Frame/Object 事件（常用）**

[onbeforeunload ][onbeforeunload]   **即将离开当前页面（刷新或关闭）时触发**

与它类似的一个事件是 [onunload ][onunload]  ， 区别: onbeforeunload在onunload之前执行，它还可 以阻止onunload的执行[具体参考][Link 1]

[onload  ][onload]**  在页面完全载入后(包括图片、css文件等等。)执行脚本代码**

[onpageshow ][onpageshow]   **用户浏览网页时触发( IE 11 以下不兼容)**

onpageshow 事件类似于 [onload][] 事件，onload 事件在页面第一次加载时触发， onpageshow 事件在每次加载页面时触发，即 onload 事件在页面从浏览器缓存中读取时不触发。

**[onresize][]    窗口或框架被重新调整了大小时触发**

**[onscroll][]    当指定文档滚动时发生事件**

**表单事件（常用）**

onblur    元素失去焦点时触发

onchange该事件在表单元素的内容改变时触发( <input>, <keygen>, <select>, 和 <textarea>)

onfocus    元素获取焦点时触发

onreset    表单重置时触发

onselect    用户选取文本时触发 ( <input> 和 <textarea>)

onsubmit    表单提交时触发

**剪贴板事件**

oncopy    该事件在用户拷贝元素内容时触发

oncut    该事件在用户剪切元素内容时触发

onpaste    该事件在用户粘贴元素内容时触发

以上只是一些常用事件，具体查看这里 ** [HTML DOM 事件][HTML DOM]**

[onbeforeunload]: http://www.runoob.com/jsref/event-onbeforeunload.html
[onunload]: http://www.runoob.com/jsref/event-onunload.html
[Link 1]: http://www.asheep.cn/skill/onunload.html
[onload]: http://www.runoob.com/jsref/event-onload.html
[onpageshow]: http://www.runoob.com/jsref/event-onpageshow.html
[onresize]: http://www.runoob.com/jsref/event-onresize.html
[onscroll]: http://www.runoob.com/jsref/event-onscroll.html
[HTML DOM]: http://www.runoob.com/jsref/dom-obj-event.html