HTML KeyboardEvent location用法及代碼示例

KeyboardEvent位置屬性用於返回一個數字，該數字指示鍵盤或設備上按鍵的位置。 KeyboardEvent位置屬性可用於onkeydown和onkeyup事件，但不能用於onkeypress。

KeyboardEvent位置屬性返回的數字由4個常量表示：

不變	位置	描述
0	DOM_KEY_LOCATION_STANDARD	該值幾乎代表鍵盤上的每個鍵，例如“B”，“R”，“SPACE”或“8”。
1	DOM_KEY_LOCATION_LEFT	該值表示左鍵，例如左“CTRL”鍵或左“ALT”鍵。
2	DOM_KEY_LOCATION_RIGHT	此值代表一個右鍵，例如右“CTRL”鍵或右“ALT”鍵。
3	DOM_KEY_LOCATION_NUMPAD	此值表示數字鍵或小鍵盤鍵。

用法

event.location

以下示例程序旨在說明KeyboardEvent的位置屬性：

示例1：獲取 key 的位置。

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>KeyboardEvent location Property in HTML 
  </title> 
    <style> 
        div { 
            border:3px solid green; 
            height:100px; 
            width:500px; 
        } 
          
        h1 { 
            color:green; 
        } 
          
        h2 { 
            font-family:Impact; 
        } 
          
        body { 
            text-align:center; 
        } 
    </style> 
</head> 
  
<body> 
  
    <h1>GeeksforGeeks</h1> 
    <h2>KeyboardEvent location Property</h2> 
  
    <p>To return the location of a key, 
      insert some character in the field.</p> 
  
    <input type="text" 
           size="20" 
           onkeydown="keyboard(event)"> 
  
    <p id="test"></p> 
  
    <script> 
        function keyboard(event) { 
            
            //  Return location of key. 
            var gfg = event.location; 
            document.getElementById("test").innerHTML =  
              "Location of the pressed key is:" + gfg; 
        } 
    </script> 
  
</body> 
  
</html>

輸出：
按下按鈕之前：

按下按鈕後：

支持的瀏覽器：

Opera
IE瀏覽器
穀歌瀏覽器
Firefox
蘋果Safari

相關用法

注：本文由純淨天空篩選整理自Shubrodeep Banerjee大神的英文原創作品 HTML | DOM KeyboardEvent location Property。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。