1. 程式人生 > 程式設計 >JavaScript 監聽組合按鍵思路及程式碼實現

JavaScript 監聽組合按鍵思路及程式碼實現

JavaScript監聽組合按鍵

1. 思路

JavaScript 監聽組合按鍵思路及程式碼實現

如圖,通過監聽並列印鍵盤keydown事件,得到圖示內容,觀察發現,
當按下的組合鍵包含Ctrl鍵時,ctrlKey鍵會顯示為true;
當按下的組合鍵包含Shift鍵、或者按鍵之前開啟大寫時,shiftkey鍵會顯示為true;
當按下的組合鍵包含Alt鍵時,altKey鍵會顯示為true;
當按下的組合鍵包含meta鍵(Mac電腦上 是 【⌘】、command鍵,非mac電腦為 是win鍵時,metaKey鍵會顯示為true
另外,按下鍵時,可通過event獲取對應鍵的ascii碼,結合這些資訊就可以對按鍵進行判斷了

2. 程式碼例項

 // 按下鍵盤事件處理函式

    onKeyDown(event) {

      const keyCode = event.keyCode || event.which || event.charCode; // 有些瀏覽器除了通過keyCode獲取輸入鍵code,還可以通過which,charCode獲取,這麼寫是出於瀏覽器相容性考慮

      const keyCombination = event.ctrlKey ;

      if (keyCombination && keyCode == 75) {

        console.log("按下了Ctrl + k鍵");

      }

    }

到此這篇關於JavaScript 監聽組合按鍵思路及程式碼實現的文章就介紹到這了,更多相關JavaScript 監聽組合按鍵內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!