在 GreaseMonkey/TamperMonkey 上使用 JavaScript 将箭头键重新映射到另一个键答案

【问题标题】：Remap arrow keys to another keys with JavaScript on GreaseMonkey/TamperMonkey在 GreaseMonkey/TamperMonkey 上使用 JavaScript 将箭头键重新映射到另一个键
【发布时间】：2021-08-31 20:30:56
【问题描述】：

我正在尝试设置 TamperMonkey 脚本以将 Right Arrow 键重新分配给 F 键。

我尝试了这段代码，但到目前为止，当我按下 F 时，没有任何反应。

    (function(){
document.addEventListener('keydown', function(e) {
 // pressed F
  if (e.keyCode == 70 && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
  keyCode == 39 // this should trigger the right arrow
  }
}, false);
})();

有人可以告诉我吗？

【问题讨论】：

几件事... 1) keyCode 没有在那里定义，我想你的意思是e.keyCode，2) == 不会修改变量的值，@ 987654329@ 可以（但在这种情况下不能，因为...） 3) e.keyCode 是只读属性，您不能修改它。你也许可以使用这个：developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/…
@Samathingamajig，谢谢。我已经从您指定的页面尝试了几种不同的组合，但没有任何效果。你能指定我应该在“//这应该触发右箭头”旁边放什么，因为它实际上会触发右箭头吗？我不是开发人员，我只是尝试使用一些 JavaScript 框架来修复我用来工作的系统。我已经实现了将键分配给一些虚拟按钮，但是这个我已经一个星期了，尝试代码的替代品，但没有任何效果。我非常感谢您能提供的任何帮助。

标签： javascript tampermonkey greasemonkey-4

【解决方案1】：

您需要在整个document 或通过document.querySelector、document.getElementById 等的特定元素上使用the KeyboardEvent constructor，然后使用run dispatchEvent。

运行下面的 sn-p 以查看实际情况。

（顺便说一句，using KeyboardEvent.keyCode is depricated 支持 KeyboardEvent.key。它仍然适用于主要的网络浏览器以实现向后兼容性，但它已在标准中被正式弃用）

（如果您想在自定义 DOM 元素上运行键盘事件，请确保 TamperMonkey 脚本在 document-end 运行）

window.addEventListener('keydown', (e) => {
    if (e.key == 'ArrowRight') console.log('right arrow pressed');
});

// Your TamperMonkey script starts here
(() => {
    window.addEventListener('keydown', (e) => {
        if (e.key == 'f' && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
            console.log('f pressed');

            // https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/KeyboardEvent
            const keyboardEvent = new KeyboardEvent('keydown', {
                key: 'ArrowRight',
                keyCode: 39,
                bubbles: true,
                cancelable: true,
                shiftKey: false,
                ctrlKey: false,
                altKey: false,
                metaKey: false,
            });

            // https://stackoverflow.com/a/44190874/12101554
            // replace `document` with a specific element if you want to do a specific
            document.dispatchEvent(keyboardEvent);
        }
    });
})();

<p>
  press right arrow &amp; f key to see things happen
</p>
<button onclick="document.querySelector('.as-console').innerHTML = ''">clear console</button>

但是，没有办法禁止 f 在该网站上执行其他操作。如果你想这样做，你可以安装 AutoHotKey (Wikipedia Link)，用这一行创建一个 AutoHotKey 脚本：

f::^Right

https://www.autohotkey.com/docs/misc/Remap.htm#Remap

当你启动这个 AHK 脚本时，AHK 会在（大多数）程序之前拦截关键事件并对其进行修改。

【讨论】：

你绝对解决了我的问题@samathingamajig！我刚刚从脚本中删除了 console.log，将 A 设置为左箭头，将 D 设置为右箭头，现在我完全可以控制我应该做什么，而无需从鼠标中取出右手。我希望双手只在键盘上，因为鼠标会伤到我的手腕和肘部。你是大师，伙计！非常感谢！

【解决方案2】：

正如@samathingamajig 所解决的那样，我刚刚将此脚本设置为键A 解释Left Arrow，并将D 解释为Right Arrow。

在我的TamperMonkey：

// MEDIA TO THE RIGHT - ASSIGNED TO *D* KEY
(() => {
    window.addEventListener('keydown', (e) => {
        if (e.key == 'd' && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
            ;

            const keyboardEvent = new KeyboardEvent('keydown', {
                key: 'ArrowRight',
                keyCode: 39,
                bubbles: true,
                cancelable: true,
                shiftKey: false,
                ctrlKey: false,
                altKey: false,
                metaKey: false,
            });

            document.dispatchEvent(keyboardEvent);
        }
    });
})();


// MEDIA TO THE LEFT - ASSIGNED TO *A* KEY
(() => {
    window.addEventListener('keydown', (e) => {
        if (e.key == 'a' && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
            ;

            const keyboardEvent = new KeyboardEvent('keydown', {
                key: 'ArrowLeft',
                keyCode: 39,
                bubbles: true,
                cancelable: true,
                shiftKey: false,
                ctrlKey: false,
                altKey: false,
                metaKey: false,
            });

            document.dispatchEvent(keyboardEvent);
        }
    });
})();

【讨论】：