如何在JavaScript中使用鍵盤事件？很多新手對(duì)此不是很清楚，為了幫助大家解決這個(gè)難題，下面小編將為大家詳細(xì)講解，有這方面需求的人可以來學(xué)習(xí)下，希望你能有所收獲。

成都創(chuàng)新互聯(lián)公司是一家專業(yè)提供姚安企業(yè)網(wǎng)站建設(shè),專注與成都網(wǎng)站制作、成都做網(wǎng)站、H5響應(yīng)式網(wǎng)站、小程序制作等業(yè)務(wù)。10年已為姚安眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)絡(luò)公司優(yōu)惠進(jìn)行中。

javascript是一種什么語言

javascript是一種動(dòng)態(tài)類型、弱類型的語言，基于對(duì)象和事件驅(qū)動(dòng)并具有相對(duì)安全性并廣泛用于客戶端網(wǎng)頁開發(fā)的腳本語言，同時(shí)也是一種廣泛用于客戶端Web開發(fā)的腳本語言。它主要用來給HTML網(wǎng)頁添加動(dòng)態(tài)功能，現(xiàn)在JavaScript也可被用于網(wǎng)絡(luò)服務(wù)器，如Node.js。

JavaScript 鍵盤事件有以下3種

keydown
鍵盤按鍵按下（如果按著不放，會(huì)持續(xù)觸發(fā)該事件），可以捕獲組合鍵。

keypress
鍵盤非功能按鍵按下（在keydown之后觸發(fā)，如果按著不放會(huì)持續(xù)觸發(fā)該事件），只能捕獲單個(gè)鍵。

keyup
鍵盤按鍵彈起，可以捕獲組合鍵。

全局事件對(duì)象event

event.ctrlKey
功能鍵”ctrl”鍵是否按下。

event.altKey
功能鍵”alt”鍵是否按下。

event.shiftKey
功能鍵”shift”鍵是否按下。

event.keyCode
鍵盤按鍵鍵碼。

event.charCode
鍵盤非功能按鍵的ASCII值，可以用其區(qū)分大小寫。

String.fromCharCode(event.charCode)
將ASCII值轉(zhuǎn)化為對(duì)應(yīng)的字符形式。

注意點(diǎn)

• KeyDown觸發(fā)后，不一定觸發(fā)KeyUp。比如此時(shí)單擊鼠標(biāo)右鍵。

• 其中PrScrn 按鍵KeyPress、KeyDown和KeyUp 都不能捕獲。

• KeyPress主要用來捕獲數(shù)字（包括Shift+數(shù)字的符號(hào)）、字母（注意：包括大小寫）、小鍵盤等除了F1-12、SHIFT、Alt、Ctrl、Insert、Home、PgUp、Delete、End、PgDn、ScrollLock、Pause、NumLock、{菜單鍵}、{開始鍵}和方向鍵外的ANSI字符。

• KeyDown 和 KeyUp 的keyCode區(qū)分小鍵盤和主鍵盤的數(shù)字字符。KeyPress 則不區(qū)分小鍵盤和主鍵盤的數(shù)字字符。

keyCode	key
8	BackSpace BackSpace
9	Tab Tab
12	Clear
13	Enter
16	Shift_L
17	Control_L
18	Alt_L
19	Pause
20	Caps_Lock
27	Escape Escape
32	space space
33	Prior
34	Next
35	End
36	Home
37	Left
38	Up
39	Right
40	Down
41	Select
42	Print
43	Execute
45	Insert
46	Delete
47	Help
48	0 equal braceright
49	1 exclam onesuperior
50	2 quotedbl twosuperior
51	3 section threesuperior
52	4 dollar
53	5 percent
54	6 ampersand
55	7 slash braceleft
56	8 parenleft bracketleft
57	9 parenright bracketright
65	a A
66	b B
67	c C
68	d D
69	e E EuroSign
70	f F
71	g G
72	h H
73	i I
74	j J
75	k K
76	l L
77	m M mu
78	n N
79	o O
80	p P
81	q Q at
82	r R
83	s S
84	t T
85	u U
86	v V
87	w W
88	x X
89	y Y
90	z Z
96	KP_0 KP_0
97	KP_1 KP_1
98	KP_2 KP_2
99	KP_3 KP_3
100	KP_4 KP_4
101	KP_5 KP_5
102	KP_6 KP_6
103	KP_7 KP_7
104	KP_8 KP_8
105	KP_9 KP_9
106	KP_Multiply KP_Multiply
107	KP_Add KP_Add
108	KP_Separator KP_Separator
109	KP_Subtract KP_Subtract
110	KP_Decimal KP_Decimal
111	KP_Divide KP_Divide
112	F1
113	F2
114	F3
115	F4
116	F5
117	F6
118	F7
119	F8
120	F9
121	F10
122	F11
123	F12
124	F13
125	F14
126	F15
127	F16
128	F17
129	F18
130	F19
131	F20
132	F21
133	F22
134	F23
135	F24
136	Num_Lock
137	Scroll_Lock
187	acute grave
188	comma semicolon
189	minus underscore
190	period colon
192	numbersign apostrophe
210	plusminus hyphen macron
211
212	copyright registered
213	guillemotleft guillemotright
214	masculine ordfeminine
215	ae AE
216	cent yen
217	questiondown exclamdown
218	onequarter onehalf threequarters
220	less greater bar
221	plus asterisk asciitilde
227	multiply division
228	acircumflex Acircumflex
229	ecircumflex Ecircumflex
230	icircumflex Icircumflex
231	ocircumflex Ocircumflex
232	ucircumflex Ucircumflex
233	ntilde Ntilde
234	yacute Yacute
235	oslash Ooblique
236	aring Aring
237	ccedilla Ccedilla
238	thorn THORN
239	eth ETH
240	diaeresis cedilla currency
241	agrave Agrave atilde Atilde
242	egrave Egrave
243	igrave Igrave
244	ograve Ograve otilde Otilde
245	ugrave Ugrave
246	adiaeresis Adiaeresis
247	ediaeresis Ediaeresis
248	idiaeresis Idiaeresis
249	odiaeresis Odiaeresis
250	udiaeresis Udiaeresis
251	ssharp question backslash
252	asciicircum degree
253	3 sterling
254	Mode_switch

測(cè)試范例

  
    
      function appendText(str) {
        document.body.innerHTML += (str+"
");
      }
      document.onkeydown = function(){
        //如果長(zhǎng)按的話，會(huì)持續(xù)觸發(fā)keydown和keypress(如果有該事件的話)
        appendText("onkeydown");
        if(event.ctrlKey) {
          appendText("ctrlKey");
        }
        if(event.altKey) {
          appendText("altKey");
        }
        if(event.shiftKey) {
          appendText("shiftKey");
        }
        //無charCode屬性，只有keypress才有該屬性
        if(event.charCode) {
          appendText(String.fromCharCode(event.charCode));
        }
        if(event.keyCode) {
          appendText(event.keyCode);
        }
        //該語句只對(duì)chrome和edge有效，可以屏蔽keypress(只對(duì)chrome和edge瀏覽器有效)
        //event.returnValue = false;
      };
      document.onkeypress = function() {
        //keypress無法監(jiān)聽到組合鍵
        appendText("onkeypress");
        if(event.ctrlKey) {
          appendText("ctrlKey");
        }
        if(event.altKey) {
          appendText("altKey");
        }
        if(event.shiftKey) {
          appendText("shiftKey");
        }
        //charCode是字母的Unicode值
        if(event.charCode) {
          appendText(String.fromCharCode(event.charCode));
        }
      }
      document.onkeyup = function() {
        appendText("onkeyup");
      }
    
  

這里使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼，運(yùn)行效果如下圖所示：

看完上述內(nèi)容是否對(duì)您有幫助呢？如果還想對(duì)相關(guān)知識(shí)有進(jìn)一步的了解或閱讀更多相關(guān)文章，請(qǐng)關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司行業(yè)資訊頻道，感謝您對(duì)創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司的支持。

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、網(wǎng)站設(shè)計(jì)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

網(wǎng)頁題目：如何在JavaScript中使用鍵盤事件-創(chuàng)新互聯(lián)
文章路徑：http://weahome.cn/article/doejje.html