无法在 Mac 上的 Chrome 上捕捉 Cmd-S

Can't catch Cmd-S on Chrome on Mac

我正在尝试捕捉 Ctrl-SCmd-S 在浏览器上用于我的网络应用程序的交叉 OS 兼容性。我在这里看到了一个关于如何做到这一点的帖子:jquery keypress event for cmd+s AND ctrl+s

我的代码中有以下片段:

$(document).keypress(function(event) {
  if (event.which == 115 && (event.ctrlKey||event.metaKey)|| (event.which == 19)) {
    event.preventDefault();
    save();
    return false;
  }
  return true;
});

其中 save() 是一个 JavaScript 函数,它将在将来发送 AJAX 请求,但目前只有 alert('Saved!');

但是,虽然这会捕获 Ctrl-S,但它不会捕获 Cmd -S on Chrome,而不是像往常一样打开保存网页对话框。我看到该页面上的其他人也有同样的问题,但我没有看到解决方案。

提前致谢!

我认为您拥有的按键不会以完全相同的方式注册元键,请参阅: 这里是一个 fiddle 似乎可以使用 keydown,然后捕获每个顺序。希望对您有所帮助?

var metaflag = false;

$(document).on({
 keydown: function(event) {
    if (event.ctrlKey||event.metaKey || event.which === 19) {
      event.preventDefault();
      $('.monitor').text('key '+event.which);
      metaflag = true;
    }
   if( metaflag && event.which === 83 ){ // 83 = s?
      event.preventDefault(); // maybe not necessary
      $('.display').text('saving?');
      metaflag = false;
    }
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class='monitor'></div>
<div class='display'></div>

太巧妙了!!!太棒了@Sam0.

对于喜欢简单 JavaScript 版本,没有 JQuery 的初学者(即使当你抓住了这个东西,$() 只允许你方便地指定一个 CSS 选择器), 这是脚本:

/**
* CMD+S/CTRL+S
* Function listens first to cmd or ctrl keys.
* Metaflag variable becomes true if one of those keys is pressed.
* If key "s" is then listened - before 100ms delay -, it launches your    
  instructions. 
* Without timer, "s" could happen (e.g.) 1 hour after alteration key pressed,     
* even if your just type "s" in a text. Timer is a trick to avoid this.
*/

(function(){
  var metaflag = false;
  document.addEventListener('keydown',function(event) {
    if (event.ctrlKey||event.metaKey || event.which === 19) {
      //      ctrl           cmd(mac)         break/pause key(?)
      metaflag = true;
      timer = Date.now();
    }
    if(metaflag && event.which === 83 && Date.now()-timer<100){
      //                 "S"                                //100ms
      event.preventDefault(); // maybe not necessary
      //...Your instructions...
      metaflag = false;
    }
  });
})();