"檢測組合按鍵（Control、Alt、Shift）？"

Question

我試圖在按下 Ctrl<\/kbd> + Alt<\/kbd> + e<\/kbd>時運行腳本。
Tampermonkey 如何同時使用 ctrl、alt 和 e 鍵觸發？

我試過ctrlKey<\/code>和altKey<\/code> 。 我沒有發現任何有用的東西。
如何編輯下面的腳本以在Ctrl<\/kbd> + Alt<\/kbd> + e<\/kbd>上觸發，而不僅僅是e<\/kbd> ？

Answer 1

有關鍵盤事件，請參閱 W3C 規范。 提供了幾個布爾屬性來確定修改鍵是否與您感興趣的任何目標鍵一起按下。它們是：

• ctrlKey “控制”鍵也被按下。
• shiftKey -- "Shift" 鍵也被按下。
• altKey ——“Alt”鍵也被按下。
• metaKey ——“Meta”鍵也被按下。

其他重要說明：

1. 不推薦使用which屬性。
2. 使用keydown因為Chrome 不會觸發已知鍵盤快捷鍵的keypress事件。
3. 一些規范的屬性，例如key ，在 Firefox 中只是部分功能。
4. 您不需要將代碼包裝在像 Tampermonkey（或 Greasemonkey 或大多數用戶腳本引擎）那樣的匿名函數中。 范圍保護是自動提供的。

因此，您的代碼將變為：

document.addEventListener ("keydown", function (zEvent) {
    if (zEvent.ctrlKey  &&  zEvent.altKey  &&  zEvent.key === "e") {  // case sensitive
        // DO YOUR STUFF HERE
    }
} );

---

運行這個方便的演示^{_{（現在更新， key是完全支持）}} ：

 var targArea = document.getElementById ("keyPrssInp"); targArea.addEventListener ('keydown', reportKeyEvent); function reportKeyEvent (zEvent) { var keyStr = ["Control", "Shift", "Alt", "Meta"].includes(zEvent.key) ? "" : zEvent.key + " "; var reportStr = "The " + ( zEvent.ctrlKey ? "Control " : "" ) + ( zEvent.shiftKey ? "Shift " : "" ) + ( zEvent.altKey ? "Alt " : "" ) + ( zEvent.metaKey ? "Meta " : "" ) + keyStr + "key was pressed." ; $("#statusReport").text (reportStr); //--- Was a Ctrl-Alt-E combo pressed? if (zEvent.ctrlKey && zEvent.altKey && zEvent.key === "e") { // case sensitive this.hitCnt = ( this.hitCnt || 0 ) + 1; $("#statusReport").after ( '<p>Bingo! cnt: ' + this.hitCnt + '</p>' ); } zEvent.stopPropagation (); zEvent.preventDefault () }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <p><label>Press keys in here:<input type="text" value="" id="keyPrssInp"></label> </p> <p id="statusReport"></p>

Answer 2

keypress事件在按鍵被按下后立即觸發。 如果您按下多個鍵，每次按下都會觸發事件，因此它們被視為獨立的按鍵。

相反，您可以同時使用keydown和keyup事件來檢測多個按鍵。 您可以擁有一個包含 3 個鍵和一個布爾狀態的對象。 在keydown事件中，如果當前鍵與對象中的鍵匹配，則將該鍵的狀態設置為true 。 在keyup事件中，您將當前鍵的狀態重置為false 。 如果在最后一次按鍵時所有 3 個狀態都為true ，則觸發該事件。

請參閱使用 jQuery 實現此邏輯的示例。

更新Brock 的答案對於您將修飾鍵與單個鍵代碼目標結合使用是一個更好的解決方案，因為ctrlKey和altKey修飾符是組合檢測的，而不是獨立處理的。 例如，如果您想同時檢測多個鍵代碼，例如E和F ，您需要按照上面的方法使用keydown和keyup來跟蹤它們。

Answer 3

如果您像我一樣來到這里了解如何檢測“Alt Gr”鍵與字母鍵的組合，那么例如 event.altKey 之類的屬性不能用於此，因為沒有 event.AltGrKey財產。

在這種情況下，您可以使用

event.getModifierState('AltGraph')

有關更多詳細信息，請參閱https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/getModifierState

Answer 4

我正在使用hotkeys-js<\/a>來抽象功能，但仍然必須讓用戶選擇自己的自定義快捷方式（事先不知道）。 然后我嘗試了@Brock Adams 的答案，以獲得輸入框中按下的快捷鍵的等效格式的 hotkeys-js。

我在實驗時發現的東西（在 Chrome 92 上的意大利 QWERTY 鍵盤布局上）：

• 每個 AltGr 字符“丟失”修飾符屬性。 AltGr 可以替換為 Ctrl+Alt 組合。 所以Ctrl+Alt+E<\/code> （如在 OP 問題中）給出€<\/code> 。 Ctr+Alt+5<\/code>也是如此。 其他組合也有同樣的問題，比如Ctrl+Alt+ò<\/code>在意大利語鍵盤上給出@<\/code><\/li>
• 每個 Shifted 字符都在e.key<\/code>中找到，因為它是移位對應物，保留修飾符屬性，因此Shift+5<\/code>打印為Shift+%<\/code>這是有問題的（考慮到 AltGr 行為）。<\/li>
• 有些組合無論如何都不會觸發事件。 我在我的鍵盤上找到了Ctrl+Shift+9<\/code> 、 Ctrl+Shift+0<\/code> 、 Ctrl+Shift+L<\/code>和Ctrl+Shift+Alt+D<\/code>作為示例。 這可能是薄膜鍵盤的限制。<\/li><\/ul>

  第二點對我來說很關鍵，因為我們的客戶習慣於 Ctrl+Shift+[Number] 組合。

  我通過處理 keyCode 介於 48 和 58 之間的特殊情況並手動轉換為相應的數字來解決它。 雖然它仍然沒有解決任何其他用 Shift 修改的特殊字符，但是鑒於它們非常依賴於鍵盤布局，我看不到任何通用的解決方案。 盡管如此，我從來不知道有人想要一個帶有特殊字符的快捷方式。

  如果不要求可讀性和\/或您事先知道要檢查的組合鍵，則使用event.keyCode<\/a>而不是event.key<\/code>可能更安全。

Answer 5

速記。 如果您檢測到班次，那么您需要將要檢查的任何字母大寫。 Shift 將通常的小寫字母大寫。

對比