如何在没有jQuery或任何其他库的情况下捕获CTRL-S？

Question

如何在网页中捕获CTRL+ S事件？

我不想使用jQuery或任何其他特殊库.

感谢您的帮助.

Answer 1

如果你只是使用native/vanilla JavaScript,那么这应该会达到你所追求的结果:

var isCtrl = false;
document.onkeyup=function(e){
    if(e.keyCode == 17) isCtrl=false;
}

document.onkeydown=function(e){
    if(e.keyCode == 17) isCtrl=true;
    if(e.keyCode == 83 && isCtrl == true) {
        //run code for CTRL+S -- ie, save!
        return false;
    }
}

发生了什么？

所述的onkeydown方法检查以查看它是否是CTRL键被按压(键码17).如果是这样,我们将isCtrl值设置为true,以将其标记为已激活并正在使用中.我们可以在onkeyup函数中将此值恢复为false.

然后我们查看是否有任何其他键与ctrl键一起被按下.在该示例中,密钥代码83用于S密钥.您可以在此函数中添加自定义处理/数据操作/保存方法,并返回false以尝试阻止浏览器对CTRL-S键执行操作.

Answer 2

2020 年的最新答案。

由于最近更改了键盘事件对象，并且其许多旧属性现已弃用，以下是现代化代码：

document.addEventListener('keydown', e => {
  if (e.ctrlKey && e.key === 's') {
    // Prevent the Save dialog to open
    e.preventDefault();
    // Place your code here
    console.log('CTRL + S');
  }
});

请注意新key属性，其中包含有关描边键的信息。此外，某些浏览器可能不允许代码覆盖系统快捷方式。

Answer 3

document.onkeydown = function(e) {
    if (e.ctrlKey && e.keyCode === 83) {
        alert('hello there');

        // your code here
        return false;
    }
};

您需要替换document实际的输入字段.

DEMO