JCZ2MkKb5S8ZX9pq

js 如何屏蔽 Chrome 的部分快捷键

  •  
  •   JCZ2MkKb5S8ZX9pq · Sep 26, 2022 · 2380 views
    This topic created in 1364 days ago, the information mentioned may be changed or developed.

    需求是

    • 希望在网页上使用自定义快捷键。
    • 但部分希望自定义的快捷键跟 Chrome 自有快捷键冲突了,比如 Ctrl+Shfit+A 、Ctrl+ShiftG ,都会被浏览器先触发。
    • 如果直接在 keydown 后 preventDefault ,可以阻挡大部分的快捷键,但一些浏览器常用键也就被覆盖了,比如 Ctrl+R 刷新页面也不行了。
    • 但如果在判断组合键之后,再 preventDefault 也会触发 Chrome 默认快捷键(猜测是判断组合键那几微秒的延迟,就被 Chrome 截胡了)。
    • Github 在任意页面输入 Ctrl+K 、Cmd+K ,都可以唤起窗口,但不影响 Chrome 其他的快捷键设置。好奇人家是怎么实现的。
    7 replies    2022-09-27 01:01:16 +08:00
    JCZ2MkKb5S8ZX9pq
        1
    JCZ2MkKb5S8ZX9pq  
    OP
       Sep 26, 2022
    包括 vue 的官方文档,也是用 Ctrl+K 触发搜索,但没影响其他 Chrome 原本的快捷键。
    vopin
        3
    vopin  
       Sep 26, 2022 via iPhone
    preventDefault 可以用呀,不需要别的操作。
    JCZ2MkKb5S8ZX9pq
        4
    JCZ2MkKb5S8ZX9pq  
    OP
       Sep 26, 2022
    @huxins
    @vopin
    我也感觉 preventDefault 应该可以,但不知道为啥我判断组合键之后,它就先被浏览器占用了。
    我组合键大约有 10 组,我之前是怀疑判断时候那些微的耗时,会不会导致浏览器先占了。
    dcsuibian
        5
    dcsuibian  
       Sep 26, 2022
    document.body.addEventListener('keydown', event => {
    if ('p' === event.key.toLowerCase() && (event.getModifierState('Meta') || event.getModifierState('Control'))) {
    event.preventDefault()
    console.log('检测到组合键')
    }
    }, false)


    我是 Mac ,打印的快捷键是 command+p ,windows 上我猜应该是 ctrl+p
    实测,像是打印、查找是能够拦截住的,但打开新窗口的快捷键不行
    如果把'keydown'改成'keypress'也不行
    JCZ2MkKb5S8ZX9pq
        6
    JCZ2MkKb5S8ZX9pq  
    OP
       Sep 27, 2022
    @dcsuibian 好像是看有几个地方说 ctrl+N 不行,但我现在是 ctrl+shift+g 这种都不行,还在查。
    JCZ2MkKb5S8ZX9pq
        7
    JCZ2MkKb5S8ZX9pq  
    OP
       Sep 27, 2022
    好像忽然又可以了,谢谢各位。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5596 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 39ms · UTC 01:49 · PVG 09:49 · LAX 18:49 · JFK 21:49
    ♥ Do have faith in what you're doing.