【问题标题】:Jquery, Disable Browser Shortcut keysJquery,禁用浏览器快捷键
【发布时间】:2014-06-22 22:54:12
【问题描述】:

我试图阻止我的项目的一些浏览器快捷键,例如如果用户按下 F1 键,那么它应该从项目中打开一个新页面,但浏览打开它的帮助页面。如果我按 Ctrl + N 那么它应该打开特定页面但浏览器打开新窗口。

这是我的代码。 (FIDDLE)

$('body').keypress(function(event){

            if (event.keyCode == 17 && event.keyCode == 110)
            {
                alert("New");   
            }
            else
            {
                event.preventDefault(); 
            }


          });

【问题讨论】:

  • 我认为您必须单独处理控制键和字符键,存储修饰键的状态。 iirc 您不能覆盖浏览器的决定(可配置,至少在opera和firefox上)是否将新视口作为选项卡或新窗口打开。附带说明:您应该使用类型安全的比较运算符(=== 而不是 ==)和规范化的 which 属性而不是 jquery api 文档推荐的 keyCode
  • @collapsar 你能在 jsfiddle 上演示吗?
  • 是的,正如 collapsar 所说,任何对您的操作系统或浏览器具有特殊意义的键组合都不会引发您可以处理的事件

标签: javascript jquery html browser keyboard-shortcuts


【解决方案1】:

您似乎无法干扰对浏览器具有特殊语义的 ctrl+键组合(至少在 chrome 34 上似乎是这种情况)。

看看this fiddle 演示了一些查询键和键组合的方法。请注意,在按下ctrl+n 时,keydown 处理程序仍会触发状态转换(通过检查击键序列ctrl+nshift+nshift+n 上的警报来证明)。

但是,我还没有找到一种方法来阻止浏览器在 ui 中声明具有含义的击键(从用户的角度来看,我认为这很好)。

编辑

我发现this SO answer 解决了 chrome 上的问题(警告:我尚未针对当前版本的 chrome 测试解决方案)。

【讨论】:

    【解决方案2】:

    如果你没有限制使用 jQuery,这是一个简洁的 sn-p,完全可以满足你的需求:

    var isCtrlHold = false;
    var isShiftHold = false;
    
    $(document).keyup(function (e) {
        if (e.which == 17) //17 is the code of Ctrl button
            isCtrlHold = false;
        if (e.which == 16) //16 is the code of Shift button
            isShiftHold = false;
    });
    $(document).keydown(function (e) {
        if (e.which == 17)
            isCtrlHold = true;
        if (e.which == 16)
            isShiftHold = true;
        
        ShortcutManager(e);
    });
    
    function ShortcutManager(e){
        //F1:
        if (e.which == 112) { //112 is the code of F1 button
            e.preventDefault(); //prevent browser from the default behavior
            alert("F1 is pressed");
        }
        
        //Ctrl+K:
        if (isCtrlHold && e.which == 75) { //75 is the code of K button
            e.preventDefault(); //prevent browser from the default behavior
            alert("Ctrl+K is pressed");
        }
    }
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    Press F1 or press Ctrl+K

    JSFiddle 上测试它。

    您可以在此处找到所有键的 javascript 代码: https://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes

    【讨论】:

      【解决方案3】:

      试试这个

      $(window).keydown(function(event) {
          if(event.ctrlKey && event.keyCode == 78) { 
              $('body').html("Hey! Ctrl+N event captured!");
                  event.preventDefault(); 
              }
          });
      });
      

      【讨论】:

      • 诚然,这个 sn-p 不起作用,无论语法错误如何,(event.ctrlKey && enent.keyCode) 的概念都不起作用。您可以在 jsFIddle 上检查修改后的代码(修改语法错误):jsfiddle.net/7qhwj8oa/1 我已经发布了一个工作示例作为答案。
      【解决方案4】:

      在Firefox中我试过这个

      $(document).ready(function(){
          $(document).keyup(function (e) {
             var code = (e.keyCode ? e.keyCode : e.which);
      
                  if(code==112)
                  {
                      alert("F1 pressed");
                  }
      
          });
       });
      

      f1 - f12: 112-123 在主要浏览器上工作

      Explorer 5-7: almost
      Firefox 2.0 Windows : yes
      Firefox 2.0 Mac: yes
      Safari 1.3:almost
      Opera 9 Windows:yes
      Opera 9 Mac: incorrect
      

      我推荐过的来源http://www.quirksmode.org/js/keys.html

      【讨论】:

        【解决方案5】:
        <html>
        <head>
        <script src="http://www.openjs.com/scripts/events/keyboard_shortcuts/shortcut.js"></script>
        <script>
            shortcut.add("F1",function() {
            alert("F1");
        });
        
        </script>
        </head>
        <body>
        Please Key press F1
        
        </body>
        </html>
        

        你可以试试这个简单易用的快捷脚本。

        【讨论】:

        • 你是.. nvm tsk
        猜你喜欢
        • 2010-12-31
        • 2011-04-10
        • 1970-01-01
        • 1970-01-01
        • 2011-02-12
        • 2018-01-11
        • 1970-01-01
        • 2010-12-25
        • 2010-10-15
        相关资源
        最近更新 更多