當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

098_键盘事件

發布時間：2025/4/17 编程问答 48 豆豆

生活随笔收集整理的這篇文章主要介紹了 098_键盘事件小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

1. onkeydown事件

1.1. onkeydown事件會在用戶按下一個鍵盤按鍵時發生。

1.2. 與onkeydown事件相關聯的事件觸發次序:

onkeydown
onkeypress
onkeyup

1.3. 語法

1.3.1. html中:

1.3.2. JavaScript中:

object.onkeydown=function(){SomeJavaScriptCode};

1.4. onkeydown屬性可以適用于所有html元素, 除了: <base>, <bdo>, <br>, <frame>, <frameset>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>和<title>。一般給body、input和textarea元素使用。

1.5. 鍵盤上幾乎所有的鍵都監聽onkeydown事件, 測試了自己的鍵盤只有PrintScreen鍵沒有監聽onkeydown事件。

2. onkeypress事件

2.1. onkeypress事件會在鍵盤按鍵被按下并釋放一個鍵時發生。

2.2. 語法

2.2.1. html中:

2.2.2. JavaScript中:

object.onkeypress=function(){SomeJavaScriptCode};

2.3. onkeypress屬性可以適用于所有html元素, 除了: <base>, <bdo>, <br>, <frame>, <frameset>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>和<title>。一般給body、input和textarea元素使用。

2.4. 一下鍵不監聽onkeypress事件。

3. onkeyup事件

3.1. onkeyup 事件會在鍵盤按鍵被松開時發生。

3.2. 語法

3.2.1. html中:

3.2.2. JavaScript中:

object.onkeyup=function(){SomeJavaScriptCode};

3.3. onkeyup屬性可以適用于所有html元素, 除了: <base>, <bdo>, <br>, <frame>, <frameset>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>和<title>。一般給body、input和textarea元素使用。

3.4. 鍵盤上所有鍵都監聽onkeyup 事件。

4. 例子

4.1. 代碼

<!DOCTYPE html> <html><head><meta charset="utf-8" /><title>鍵盤事件</title></head><body onkeydown="mykeydown(event)"><p>請按下鍵盤上的任意鍵: <br /></p><script type="text/javascript">var myP = document.querySelector("p");function mykeydown(e){myP.innerHTML += ("onkeydown ");}document.body.onkeypress = function(e){myP.innerHTML += ("onkeypress ");}document.body.addEventListener("keyup", mykeyup, false);function mykeyup(e){myP.innerHTML += ("onkeyup" + "<br />");}</script></body> </html>

4.2.?效果圖

總結

以上是生活随笔為你收集整理的098_键盘事件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。