javascript之鍵盤事件

來源:互聯網
上載者:User

javascript之鍵盤事件



鍵盤事件包含onkeydown、onkeypress和onkeyup這三個事件

事件初始化

function keyDown(){}     document.onkeydown = keyDown;     //論按下鍵盤上的哪個鍵,都將調用KeyDown()函數。

DOM標準下

function keyDown(e) {   var keycode = e.which;   //取得對應的索引值(數字)  var realkey = String.fromCharCode(e.which); //取得代表改鍵的真正字元  alert("按鍵碼: " + keycode + " 字元: " + realkey);    }     document.onkeydown = keyDown

IE下

function keyDown() {       var keycode = event.keyCode;   //IE下取得索引值的方法      var realkey = String.fromCharCode(event.keyCode);       alert("按鍵碼: " + keycode + " 字元: " + realkey);    }    document.onkeydown = keyDown

相容的方法

function keyUp(e) {      var currKey=0,e=e||event;      currKey=e.keyCode||e.which||e.charCode;      var keyName = String.fromCharCode(currKey);      alert("按鍵碼: " + currKey + " 字元: " + keyName);    }    document.onkeyup = keyUp;

使用原則:keydown事件對於功能按鍵來說是最有用的,而keypress事件對於可列印按鍵來說是最有用的

以下鍵碼值只有在文字框中才完全有效,如果在標記中使用,只有字母鍵、數字鍵和部分修飾鍵可用,其字母鍵和數字鍵的鍵值與ASCII值相同


字母和數字鍵的鍵碼值(keyCode)

按鍵 鍵碼

A 65

B 66

C 67

D 68

E 69

F 70

G 71

H 72

I 73

J 74

K 75

L 76

M 77

N 78

O 79

P 80

Q 81

R 82

S 83

T 84

U 85

V 86

W 87

X 88

Y 89

Z 90

0 48

1 49

2 50

3 51

4 52

5 53

6 54

7 55

8 56

9 57

數字鍵台上的鍵的鍵碼值(keyCode)功能鍵鍵碼值(keyCode)

按鍵 鍵碼

0 96

1 97

2 98

3 99

4 100

5 101

6 102

7 103

8 104

9 105

* 106

+ 107

Enter 108

- 109

. 110

/ 111

F1 112

F2 113

F3 114

F4 115

F5 116

F6 117

F7 118

F8 119

F9 120

F10 121

F11 122

F12 123

修飾鍵鍵碼值(keyCode)

按鍵 鍵碼

BackSpace 8

Esc 27

Right Arrow 39

Left Arrow 37

Down Arrow 40

Up Arrow 38

-_ 189

.> 190

Spacebar 32

Tab 9

Clear 12

Page Up 33

Page Down 34

Enter 13

Insert 45

;: 186

Delete 46

`~ 192

/? 191

Num Lock 144

Control 17

Home 36

End 35

Shift 16

[{ 219

}] 221

\| 220

=+ 187

,< 188

'" 222

Cape Lock 20

Alt 18

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.