时间戳

首页 > 解决方案 > Vanilla JavaScript：禁用网页中给定的预先存在的组合键

javascript - Vanilla JavaScript：禁用网页中给定的预先存在的组合键

问题描述

在这个随机的英语-维基百科编辑页面中，可以添加一些内容（比如“测试”），然后通过Alt+Shift+S.

我希望专门防止这种行为（不删除保存按钮document.querySelector("#wpSave").remove();）。

我尝试了以下失败的代码：

// ==UserScript==
// @name         wiki
// @match        https://*.wikipedia.org/*
// ==/UserScript==

document.addEventListener("DOMContentLoaded", ()=>{
    document.addEventListener('keypress', function(e) {
        if (e.key == 16 && e.key == 18 && e.key == 83) {
            return false;
        }
    });
});

我也尝试用 or 替换return false，e.preventDefault()但evt.stopPropagation()都失败了（没有控制台错误）。

代码有什么问题？

注意：这个问题与这个问题的不同之处在于，它通常侧重于禁用给定的预先存在的组合键功能，而不是一般的保存功能。

dotoconor 更新

我在控制台中使用了它，但我仍然遇到同样的问题：

document.addEventListener("DOMContentLoaded", ()=>{
    const state = {};
    document.addEventListener('keydown', function(e) {
        state[e.key] = true;
    });

    document.addEventListener('keyup', function(e) {
        state[e.key] = false;
    });

    document.addEventListener('keyup', function(e) {
        state[e.key] = false;
        if (state["Alt"] && state["Shift"] && (state["S"] || state["s"])) {
            return e.preventDefault();
        }
    });
});

标签： javascriptjqueryhtmlreturnkeyboard-shortcuts

解决方案

一次只会出现一个关键事件，因此您必须创建一个状态机来确定哪些是开启和关闭的。考虑一下：

const state = {};
document.addEventListener('keydown', function(e) {
  state[e.key] = true;
});



document.addEventListener('keyup', function(e) {
  state[e.key] = false;
});

现在有了这个，你可以检查你想要的键是否一次都被按下了，然后防止最后一次按键进入 DOM。

document.addEventListener('keyup', function(e) {
  state[e.key] = false;
  if (state["Alt"] && state["Shift"] && (state["S"] || state["s"])) {
    return e.preventDefault();
  }
});

推荐阅读