鼠标、键盘事件
type
status
date
slug
summary
tags
category
icon
password
Blocking
Blocked by
top
URL
Sub-item
Parent item
背景
由于开发富文本中遇到中文输入法输入等问题，所以总结一下。
键盘事件
触发顺序
普通输入
keydown -> keypress -> input -> change -> keyup输入法输入
输入时
keydown -> CompositionStart -> CompositionUpdate -> input -> change -> onCompositionEnd -> keyup普通事件
在
keyup 事件中无法阻止浏览器默认事件，如要阻止默认行为，必须在keydown或keypress时阻止。事件名 | 触发时机 | 备注 |
keydown | 按下任意按键。 | ㅤ |
keypress | 任意键被按住。 | 1.当按键处于按下状态时事件会持续触发。2. 按 Shift、Fn、CapsLock不能触发。3. 中文输入法中不会被触发 |
keyup | 释放任意按键。 | ㅤ |
输入框特殊事件
只会输入框中输入时触发。
事件名 | 触发时机 | 备注 |
compositionstar | 使用中文输入法，开始输入时 | 不用输入法不会触发 |
compositionend | 使用中文输入法，输入完成时 | 不用输入法不会触发 |
compositionupdate | 使用中文输入法，输入更新时 | 不用输入法不会触发 |
input | 当输入时 | ㅤ |
change | 当值变化时 | ㅤ |
鼠标事件
事件类型 | 触发时机 | 备注 |
click | 单击鼠标左键，按键抬起后 | 如果左右键同时按下则不会发生。当用户的焦点在按钮上并按了 Enter 键时，同样会触发这个事件 |
contextmenu | 单击鼠标右键，按键抬起后 | 如果左右键同时按下则不会发生。 |
dblclick | 双击鼠标左键时 | 如果右键也按下则不会发生。 |
mousedown | 鼠标左键或右键按下时 | ㅤ |
mouseup | 鼠标左键或右键抬起后 | ㅤ |
mouseover | 当鼠标移入元素或其子元素时 | 因为移动到子元素也会触发，所以会在元素里重复触发,是一个冒泡的过程。对应的移除事件是 mouseout |
mouseout | 当鼠标离开元素或其子元素时 | 离开子元素也会触发 |
mouseenter | 当鼠标移入元素本身（不包含元素的子元素）时 | 不会冒泡，只会在元素里触发一次。对应的离开事件是 mouseleave |
mouseleave | 当鼠标离开元素本身（不包含元素的子元素）时 | 离开子元素不会触发 |
mousemove | 鼠标移动时 | 会重复触发。 |