【问题标题】:keypress, ctrl+c (or some combo like that)按键,ctrl+c(或类似的组合)
【发布时间】:2011-06-03 23:51:39
【问题描述】:

我正在尝试在我正在制作的网站上创建快捷方式。我知道我可以这样做:

if(e.which == 17) isCtrl=true;
if(e.which == 83 && isCtrl == true) {
    alert('CTRL+S COMBO WAS PRESSED!')
    //run code for CTRL+S -- ie, save!
    e.preventDefault();
}

但下面的例子更简单,代码更少,但它不是组合按键事件:

$(document).keypress("c",function() {
  alert("Just C was pressed..");
});

所以我想知道是否通过使用第二个示例,我可以执行以下操作:

$(document).keypress("ctrl+c",function() {
  alert("Ctrl+C was pressed!!");
});

这可能吗?我试过了,还是不行,我做错了什么?

【问题讨论】:

    标签: jquery keypress keydown jquery-events


    【解决方案1】:

    另一种方法(不需要插件)是只使用传入的event object.ctrlKey 属性。它指示在事件发生时是否按下了 Ctrl,如下所示:

    $(document).keypress("c",function(e) {
      if(e.ctrlKey)
        alert("Ctrl+C was pressed!!");
    });
    

    【讨论】:

    • 但没有什么像:.keypress("c + s", 当我按住 c 和 s 时它会做什么?在你的代码中我必须同时按下它们,我需要按住一个键并按下另一个键,我真的只是创建一个菜单,当我按下某个键组合时会弹出一个菜单,所以也许按住 s 并左键单击或其他类似的东西,不确定我要使用什么组合键。
    • @android.nick - 不是 jQuery 核心内置的,不,你需要一个 那个 的插件,但是对于 ctrl、alt 和 shift 键,你可以只需使用.ctrlKey.altKey.shiftKey 属性。
    • @ravz - 哪个部分,在哪个版本的 jQuery 上?这东西级别很低,所以它应该可以正常工作。
    • @nick e.ctrlKey 不适用于 IE 8 .. 无论如何你的回答对我有帮助。我使用 event.keycode 来检测 ctrl+c
    • 这个函数会在control+ANY键被按下时触发。 keypress 只是忽略了第一个参数。您需要比较 e.which 以确定实际按下了哪个键。
    【解决方案2】:

    我在聚会上有点迟到了,但这是我的职责

    $(document).on('keydown', function ( e ) {
        // You may replace `c` with whatever key you want
        if ((e.metaKey || e.ctrlKey) && ( String.fromCharCode(e.which).toLowerCase() === 'c') ) {
            console.log( "You pressed CTRL + C" );
        }
    });
    

    【讨论】:

    • 这对我使用 jQuery 1.11.2 有效。接受的答案没有。
    • 同意此方法与更高版本的 jQuery 配合使用效果更好
    • Mac 的 ⌘ 是 e.metaKey 所以(e.metaKey || e.ctrlKey) && ... 为我工作
    【解决方案3】:

    改用Jquery Hotkeys 插件 - 它会满足您的所有需求。

    jQuery Hotkeys 是一个插件,它可以让 您可以轻松添加和删除处理程序 代码中任意位置的键盘事件 支持几乎任何组合键。

    这个插件是基于插件 作者:Tzury Bar Yochay:jQuery.hotkeys

    语法如下:

    $(expression).bind(types, keys, handler); $(expression).unbind(types, handler);
    
    $(document).bind('keydown', 'ctrl+a', fn);
    
    // e.g. replace '$' sign with 'EUR'
    // $('input.foo').bind('keyup', '$', function(){   
    //      this.value = this.value.replace('$', 'EUR'); });
    

    【讨论】:

    • +1 但是绑定 Ctrl+C 或任何其他预定义的热键组合并不是一个好习惯。小心处理。
    • 同意,这只是一个例子,我实际上是想找出鼠标光标弹出的菜单的最佳组合键。
    • 但是我需要的插件只是矫枉过正,我已经在上面的问题中发布了一些工作代码,第一个示例。它工作得很好,我只是想弄清楚我是否可以用我给出的第二个例子做一个组合键。不过谢谢。
    【解决方案4】:

    您不能通过 jQuery 使用 Ctrl+C ,但可以使用另一个库 shortcut.js

    现场演示: Abdennour JSFiddle

    $(document).ready(function() {
    shortcut.add("Ctrl+C", function() {
        $('span').html("أحسنت. لقد ضغطت على حرفي : Ctrl+C");
            });
        shortcut.add("Ctrl+V", function() {
        $('span').html("أحسنت. لقد ضغطت على حرفي : Ctrl+V");
            });
           shortcut.add("Ctrl+X", function() {
        $('span').html("أحسنت. لقد ضغطت على حرفي : Ctrl+X");
            });
    
    
    });
    

    【讨论】:

      【解决方案5】:

      我无法让它与 .keypress() 一起使用,但它可以与 .keydown() 函数一起使用,如下所示:

      $(document).keydown(function(e) {
          if(e.key == "c" && e.ctrlKey) {
              console.log('ctrl+c was pressed');
          }
      });
      

      【讨论】:

        【解决方案6】:

        有一个名为“Hotkeys”的 Jquery 插件,它允许您绑定到按键组合。

        这是你想要的吗?

        Jquery HotKeys - Google Code

        【讨论】:

        • 一个插件对于我所需要的简单来说有点矫枉过正,尤其是在 4.4kb 时,实在是太多了,不过还是谢谢你。
        【解决方案7】:
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script type='text/javascript'>
            var ctrlMode = false; // if true the ctrl key is down
            ///this works
            $(document).keydown(function(e){
            if(e.ctrlKey){
                ctrlMode = true;
            };
            });
            $(document).keyup(function(e){
            ctrlMode = false;
            });
        </script>
        

        【讨论】:

        • 您是否考虑添加一些叙述来解释为什么此代码有效,以及是什么使它成为问题的答案?
        • 从我刚才的测试来看 - 似乎 IE8 没有通过 some 特殊键的按键(Ctrl-C - 否,Ctrl X 和 V - 是)。而 keydown 已通过,所以这个答案有效。
        【解决方案8】:

        在 jQuery 中实现的简单方法:

        /* The elements we'll bind the shortcut keys to. */
        var elements = "body, input, select, checkbox, textarea";
        
        /* Bind the key short-cut 'Ctrl+S' to the save function. */
        $(elements).bind ("keydown", "ctrl+space", function (e) {
            // Prevent the default operation.
            e.preventDefault ();
            // Stop processing if we're already doing something.
            console.log ("That's right , you pressed correct shortcut!");
        });
        

        【讨论】:

          【解决方案9】:

          就我而言,我正在寻找一个 keydown ctrl 键和单击事件。 我的 jquery 看起来像这样:

          $('.linkAccess').click( function (event) {
            if(true === event.ctrlKey) {
          
              /* Extract the value */
              var $link = $('.linkAccess');
              var value = $link.val();
          
              /* Verified if the link is not null */
              if('' !== value){
                window.open(value);
              }
            }
          });
          

          其中“linkAccess”是一些特定字段的类名,我有一个链接,我想使用我的组合键和单击来访问它。

          【讨论】:

            【解决方案10】:

            $(window).keypress("c", function(e) {
              if (!e.ctrlKey)
                return;
            
              console.info("CTRL +  C detected !");
            });
            

            $(window).keypress("c", function(e) {
              if (!e.ctrlKey)
                return;
            
              $("div").show();
            });
            /*https://gist.github.com/jeromyanglim/3952143 */
            
            kbd {
              white-space: nowrap;
              color: #000;
              background: #eee;
              border-style: solid;
              border-color: #ccc #aaa #888 #bbb;
              padding: 2px 6px;
              -moz-border-radius: 4px;
              -webkit-border-radius: 4px;
              border-radius: 4px;
              -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2), 0 0 0 1px #ffffff inset;
              -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2), 0 0 0 1px #ffffff inset;
              box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2), 0 0 0 1px #ffffff inset;
              background-color: #FAFAFA;
              border-color: #CCCCCC #CCCCCC #FFFFFF;
              border-style: solid solid none;
              border-width: 1px 1px medium;
              color: #444444;
              font-family: 'Helvetica Neue', Helvetica, Arial, Sans-serif;
              font-size: 11px;
              font-weight: bold;
              white-space: nowrap;
              display: inline-block;
              margin-bottom: 5px;
            }
            <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
            <div style="display:none">
              <kbd>CTRL</kbd> + <kbd>C</kbd> detected !
            </div>

            【讨论】:

              【解决方案11】:

              截至 2019 年,这有效(至少在 Chrome 中)

              $(document).keypress(function(e) {
                  var key = (event.which || event.keyCode) ;
                if(e.ctrlKey) {
                      if (key == 26) { console.log('Ctrl+Z was pressed') ; }
                      else if (key == 25) { console.log('Ctrl+Y was pressed') ; }
                      else if (key == 19) { console.log('Ctrl+S was pressed') ; }
                  else { console.log('Ctrl', key, 'was pressed') ; }
                  }
              });
              

              【讨论】:

                猜你喜欢
                • 1970-01-01
                • 2012-01-17
                • 2010-12-10
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 1970-01-01
                • 2016-06-26
                相关资源
                最近更新 更多