用戶在使用鍵盤時會觸發(fā)鍵盤事件?!癉OM2 級事件”初規(guī)定了鍵盤事件,但在終定稿之前又 刪除了相應的內(nèi)容。結(jié)果,對鍵盤事件的支持主要遵循的是 DOM0級。
? ? ? ? “DOM3級事件”為鍵盤事件制定了規(guī)范,IE9率先完全實現(xiàn)了該規(guī)范。其他瀏覽器也在著手實現(xiàn)這 一標準,但仍然有很多遺留的問題。 有 3個鍵盤事件,簡述如下。?
? ? ? ? keydown:當用戶按下鍵盤上的任意鍵時觸發(fā),而且如果按住不放的話,會重復觸發(fā)此事件。?
? ? ? ? keypress:當用戶按下鍵盤上的字符鍵時觸發(fā),而且如果按住不放的話,會重復觸發(fā)此事件。
? ? ? ? 按下 Esc鍵也會觸發(fā)這個事件。Safari 3.1之前的版本也會在用戶按下非字符鍵時觸發(fā) keypress 事件。
? ? ? ?keyup:當用戶釋放鍵盤上的鍵時觸發(fā)。
? ? ? ? 雖然所有元素都支持以上 3個事件,但只有在用戶通過文本框輸入文本時才常用到。?
? ? ? ?只有一個文本事件:textInput。這個事件是對 keypress 的補充,用意是在將文本顯示給用戶之 前更容易攔截文本。在文本插入文本框之前會觸發(fā) textInput 事件。?
? ? ? ?在用戶按了一下鍵盤上的字符鍵時,首先會觸發(fā) keydown 事件,然后緊跟著是 keypress 事件, 后會觸發(fā) keyup 事件。其中,keydown 和 keypress 都是在文本框發(fā)生變化之前被觸發(fā)的;而 keyup 事件則是在文本框已經(jīng)發(fā)生變化之后被觸發(fā)的。如果用戶按下了一個字符鍵不放,就會重復觸發(fā) keydown 和 keypress 事件,直到用戶松開該鍵為止。 如果用戶按下的是一個非字符鍵,那么首先會觸發(fā) keydown 事件,然后就是 keyup 事件。
? ? ? ?如果按 住這個非字符鍵不放,那么就會一直重復觸發(fā) keydown 事件,直到用戶松開這個鍵,此時會觸發(fā) keyup 事件。 ? ? ? ?鍵盤事件與鼠標事件一樣,都支持相同的修改鍵。而且,鍵盤事件的事件對象中 也有 shiftKey、ctrlKey、altKey 和 metaKey 屬性。IE不支持 metaKey。
? ? ? ?我們先來介紹下鍵碼 后面若不需要加班,南昌網(wǎng)站建設公司百恒網(wǎng)絡前端開發(fā)工程師會接著向大家介紹textInput,因為這是對keypress事件的補充。
? ? ? ?在發(fā)生 keydown 和 keyup 事件時,event 對象的 keyCode 屬性中會包含一個代碼,與鍵盤上一 個特定的鍵對應。對數(shù)字字母字符鍵,keyCode 屬性的值與 ASCII 碼中對應小寫字母或數(shù)字的編碼相 同。因此,數(shù)字鍵 7的 keyCode 值為 55,而字母 A鍵的 keyCode 值為 65——與 Shift鍵的狀態(tài)無關(guān)。 DOM和 IE的 event 對象都支持 keyCode 屬性。南昌網(wǎng)站制作公司百恒網(wǎng)絡前端工程師結(jié)合實例向大家介紹,請看下面這個例子:
? ? ? ?
? ? ? ?
? ? ? ?
? ? ? ?在這個例子中,用戶每次在文本框中按鍵觸發(fā) keyup 事件時,都會顯示 keyCode 的值。下表列出 了所有非字符鍵的鍵碼。?
鍵 鍵 碼 鍵 鍵 碼
退格(Backspace) 8 數(shù)字小鍵盤1 97
制表(Tab) 9 數(shù)字小鍵盤2 98
回車(Enter) 13 數(shù)字小鍵盤3 99
上檔(Shift) 16 數(shù)字小鍵盤4 100
控制(Ctrl) 17 數(shù)字小鍵盤5 101
Alt 18 數(shù)字小鍵盤6 102
暫停/中斷(Pause/Break) 19 數(shù)字小鍵盤7 103
大寫鎖定(Caps Lock) 20 數(shù)字小鍵盤8 104
退出(Esc) 27 數(shù)字小鍵盤9 105
上翻頁(Page Up) 33 數(shù)字小鍵盤+ 107
下翻頁(Page Down) 34 數(shù)字小鍵盤及大鍵盤上的- 109
結(jié)尾(End) 35 數(shù)字小鍵盤 . 110
開頭(Home) 36 數(shù)字小鍵盤 / 111
左箭頭(Left Arrow) 37 F1 112
上箭頭(Up Arrow) 38 F2 113
右箭頭(Right Arrow) 39 F3 114
下箭頭(Down Arrow) 70 F4 115
插入(Ins) 45 F5 116
刪除(Del) 46 F6 117
左Windows鍵 91 F7 118
右Windows鍵 92 F8 119
上下文菜單鍵 93 F9 120
數(shù)字小鍵盤0 96 F10 121
正斜杠 191 F11 122
沉音符(`) 192 F12 123
等于 61 數(shù)字鎖(Num Lock) 144
左方括號 219 滾動鎖(Scroll Lock) 145
反斜杠() 220 分號(IE/Safari/Chrome中) 186
右方括號 221 分號(Opera/FF中) 59
單引號 222 小于 188
? 大于 190 ? ? ? ?無論keydown或keyup事件都會存在的一些特殊情況。在Firefox和Opera中,按分號鍵時keyCode 值為 59,也就是 ASCII中分號的編碼;但 IE和 Safari返回 186,即鍵盤中按鍵的鍵碼。?
? 本文僅限內(nèi)部技術(shù)人員學習交流,不得作于其他商業(yè)用途.希望此文對廣大技人員有所幫助。原創(chuàng)文章出自:南昌網(wǎng)站制作公司-百恒網(wǎng)絡http://www.myforexfactory.net/如轉(zhuǎn)載請注明出處!