keyup
event is fired when a key is released.
| 冒泡 | Yes |
|---|---|
| 可取消 | Yes |
| 接口 |
KeyboardEvent
|
| 事件处理程序特性 |
onkeyup
|
keydown
and
keyup
events provide a code indicating which key is pressed, while
keypress
indicates which character was entered. For example, a lowercase "a" will be reported as 65 by
keydown
and
keyup
, but as 97 by
keypress
. An uppercase "A" is reported as 65 by all events.
Since Firefox 65, the
keyup
and
keydown
events are now fired during IME composition, to improve cross-browser compatibility for CJKT users (
bug 354358
, also see
keydown and keyup events are now fired during IME composition
for more useful details). To ignore all
keyup
events that are part of composition, do something like this (229 is a special value set for a
keyCode
relating to an event that has been processed by an IME):
eventTarget.addEventListener("keyup", event => {
if (event.isComposing || event.keyCode === 229) {
return;
}
// do something
});
This example logs the
KeyboardEvent.code
value whenever you release a key inside the
<input>
元素。
<input placeholder="Click here, then press and release a key." size="40"> <p id="log"></p>
const input = document.querySelector('input');
const log = document.getElementById('log');
input.addEventListener('keyup', logKey);
function logKey(e) {
log.textContent += ` ${e.code}`;
}
input.onkeyup = logKey;
| 规范 | 状态 |
|---|---|
| UI Events | 工作草案 |
| 桌面 | 移动 | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
keyup
event
|
Chrome Yes | Edge ≤18 | Firefox Yes | IE ? | Opera ? | Safari ? | WebView Android Yes | Chrome Android Yes | Firefox Android Yes | Opera Android ? | Safari iOS ? | Samsung Internet Android Yes |
完整支持
兼容性未知
元素
accessKey
属性
childElementCount
children
classList
className
clientHeight
clientLeft
clientTop
clientWidth
currentStyle
firstElementChild
id
innerHTML
lastElementChild
localName
名称
namespaceURI
nextElementSibling
onfullscreenchange
onfullscreenerror
openOrClosedShadowRoot
outerHTML
part
prefix
previousElementSibling
runtimeStyle
scrollHeight
scrollLeft
scrollLeftMax
scrollTop
scrollTopMax
scrollWidth
shadowRoot
slot
tabStop
tagName
after()
animate()
append()
attachShadow()
before()
closest()
computedStyleMap()
createShadowRoot()
getAnimations()
getAttribute()
getAttributeNames()
getAttributeNode()
getAttributeNodeNS()
getAttributeNS()
getBoundingClientRect()
getClientRects()
getElementsByClassName()
getElementsByTagName()
getElementsByTagNameNS()
hasAttribute()
hasAttributeNS()
hasAttributes()
hasPointerCapture()
insertAdjacentElement()
insertAdjacentHTML()
insertAdjacentText()
matches()
msZoomTo()
prepend()
querySelector()
querySelector()
querySelectorAll()
querySelectorAll()
releasePointerCapture()
remove()
removeAttribute()
removeAttributeNode()
removeAttributeNS()
replaceChildren()
replaceWith()
requestFullscreen()
requestPointerLock()
scroll()
scrollBy()
scrollIntoView()
scrollIntoViewIfNeeded()
scrollTo()
setAttribute()
setAttributeNode()
setAttributeNodeNS()
setAttributeNS()
setCapture()
setPointerCapture()
toggleAttribute()
afterscriptexecute
auxclick
blur
click
compositionend
compositionstart
compositionupdate
contextmenu
copy
cut
dblclick
DOMActivate
DOMMouseScroll
error
focus
focusin
focusout
fullscreenchange
fullscreenerror
gesturechange
gestureend
gesturestart
keydown
keypress
keyup
mousedown
mouseenter
mouseleave
mousemove
mouseout
mouseover
mouseup
mousewheel
MozMousePixelScroll
msContentZoom
MSGestureChange
MSGestureEnd
MSGestureHold
MSGestureStart
MSGestureTap
MSInertiaStart
MSManipulationStateChanged
overflow
paste
scroll
select
show
touchcancel
touchend
touchmove
touchstart
underflow
webkitmouseforcechanged
webkitmouseforcedown
webkitmouseforceup
webkitmouseforcewillbegin
wheel