Question

如何通过JavaScript捕获Mac的 Cmd 键？

Answer 1

与 Shift / Alt / Ctrl 不同， Cmd （“Apple”）键不被视为修改键 - 您应该在keydown / keyup上进行聆听，并在按下某个键时进行记录，然后根据event.keyCode进行沮丧。

不幸的是，这些密钥代码依赖于浏览器：

Firefox：224
Opera：17
WebKit浏览器（Safari / Chrome）：91（左命令）或93（右命令）

您可能有兴趣阅读我从中学到知识的文章JavaScript Madness: Keyboard Events。

Answer 2

如果您正在使用keydown事件，还可以查看事件的event.metaKey属性。为我精彩的工作！ You can try it here

Answer 3

如果与其他键一起按下，我发现你可以在最新版本的Safari（7.0：9537.71）中检测到命令键。例如，如果要检测⌘+ x：，则可以检测x键并检查event.metaKey是否设置为true。例如：

var key = event.keyCode || event.charCode || 0;
console.log(key, event.metaKey);

当自己按x时，会输出120, false。按⌘+ x时，会输出120, true

这似乎只适用于Safari - 而不是Chrome

Answer 4

基于Ilya的数据，我写了一个Vanilla JS库来支持Mac上的修饰键：https://github.com/MichaelZelensky/jsLibraries/blob/master/macKeys.js

就这样使用它，例如：

document.onclick = function (event) {
  if (event.shiftKey || macKeys.shiftKey) {
    //do something interesting
  }
}

在Chrome上测试Chrome，Safari，Firefox和Opera。请检查它是否适合您。

Answer 5

对于使用jQuery的人来说，有一个很好的插件来处理关键事件：

jQuery hotkeys on GitHub

用于捕获⌘ + S 和 Ctrl + S 我正在使用此：

$(window).bind('keydown.ctrl_s keydown.meta_s', function(event) {
    event.preventDefault();
    // Do something here
});

Answer 6

以下是我在AngularJS中的表现方式

app = angular.module('MM_Graph')

class Keyboard
  constructor: ($injector)->
    @.$injector  = $injector
    @.$window    = @.$injector.get('$window')                             # get reference to $window and $rootScope objects
    @.$rootScope = @.$injector.get('$rootScope')

  on_Key_Down:($event)=>
    @.$rootScope.$broadcast 'keydown', $event                             # broadcast a global keydown event

    if $event.code is 'KeyS' and ($event.ctrlKey or $event.metaKey)       # detect S key pressed and either OSX Command or Window's Control keys pressed
      @.$rootScope.$broadcast '', $event                                  # broadcast keyup_CtrS event
     #$event.preventDefault()                                             # this should be used by the event listeners to prevent default browser behaviour

  setup_Hooks: ()=>
    angular.element(@.$window).bind "keydown", @.on_Key_Down              # hook keydown event in window (only called once per app load)
    @

app.service 'keyboard', ($injector)=>
  return new Keyboard($injector).setup_Hooks()

Answer 7

如果您使用Vuejs，只需通过vue-shortkey插件进行制作，一切都会变得简单

https://www.npmjs.com/package/vue-shortkey

v-shortkey="['meta', 'enter']"·
@shortkey="metaEnterTrigged"

如何通过JavaScript捕获Mac的命令键？

7 个答案: