HTML DOM KeyboardEvent location 屬性
HTML DOM KeyboardEvent location 屬性返回與鍵盤上按下鍵的位置相對應的數字。
語法
以下是語法 −
返回按下鍵的位置 −
event.location
數字
此處,返回的數字可以是以下內容: −
數字 | 描述 |
---|---|
0 | 它表示鍵盤上的幾乎所有值。(鍵盤中間部分的每個鍵,例如:‘Q’,’\’,’空格鍵’) |
1 | 它表示鍵盤左側的值。(鍵盤左側部分的每個鍵,例如:‘左 ctrl’,’左 Shift’,’左 alt’) |
2 | 它表示鍵盤右側的值。(鍵盤右側部分的每個鍵,例如:‘右 ctrl’,’右 Shift’,’右 alt’) |
3 | 它表示小鍵盤上的值。(小鍵盤部分的每個鍵,例如:‘1’,’/’,’.’) |
示例
讓我們看一個KeyboardEvent location 屬性的示例 −
<!DOCTYPE html> <html> <head> <title>KeyboardEvent location</title> <style> form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } </style> </head> <body> <form> <fieldset> <legend>KeyboardEvent-location</legend> <label>Fill in the blanks: <input type="text" id="textSelect" placeholder="type here..." onkeydown="getEventData(event)" autocomplete="off"> </label> <div id="divDisplay"></div> </fieldset> </form> <script> var divDisplay = document.getElementById("divDisplay"); var textSelect = document.getElementById("textSelect"); function getEventData(InputEvent) { if(InputEvent.location === 0) divDisplay.textContent = 'key Pressed in middle section'; else if(InputEvent.location === 1) divDisplay.textContent = 'key Pressed in left section'; else if(InputEvent.location === 2) divDisplay.textContent = 'key Pressed in right section'; else divDisplay.textContent = 'key Pressed in numpad section'; } </script> </body> </html>
輸出
這將產生以下輸出 −
在文字欄位中輸入任何內容之前 −
在文字欄位中輸入‘w’後 −
從小鍵盤中按文字欄位中的‘+’後 −
廣告