jquery:keypress,ctrl + c(或类似的一些组合)

时间:2011-01-05 12:40:07

标签: jquery javascript-events keypress keydown

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

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!!");
});
这可能吗?我试过了它并没有用,我做错了什么。

11 个答案:

答案 0 :(得分:74)

另一种方法(不需要插件)只使用传入的.ctrlKeyevent object属性。它表示在此时是否按下 Ctrl 事件,像这样:

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

答案 1 :(得分:40)

我是晚会的,但这是我的一部分

$(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" );
    }
});

答案 2 :(得分:7)

尝试使用Jquery Hotkeys插件 - 它会执行您需要的所有操作。

  

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

     

此插件基于插件   作者: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'); });

答案 3 :(得分:5)

您不能使用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");
        });


});

答案 4 :(得分:2)

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

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

答案 5 :(得分:1)

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

这会做你想做的事吗?

Jquery HotKeys - Google Code

答案 6 :(得分:1)

<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>

答案 7 :(得分:0)

在我的情况下,我正在寻找一个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”是我有链接的某些特定字段的类名,我想使用我的组合键和点击来访问它。

答案 8 :(得分:0)

enter image description here

$(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>

答案 9 :(得分:0)

从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') ; }
    }
});

答案 10 :(得分:0)

在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!");
});