Как получить командный ключ Mac через JavaScript?

Question

Как захватить ключ Mac Cmd с помощью JavaScript?

Answer 1

В отличие от Shift / Alt / Ctrl , клавиша Cmd («Apple») не считается клавишей-модификатором - вместо этого , вы должны прослушать keydown / keyup и записать, когда клавиша нажата, а затем нажата, на основе event.keyCode.

К сожалению, эти коды клавиш зависят от браузера:

• Firefox: 224
• Опера: 17
• Браузеры WebKit (Safari / Chrome): 91 (левая команда) или 93 (правая команда)

Возможно, вам будет интересно прочитать статью JavaScript Madness: Keyboard Events , из которой я получил эти знания.

Answer 2

Вы также можете посмотреть атрибут event.metaKey события, если вы работаете с событиями нажатия клавиш. Работал чудесно для меня! Вы можете попробовать это здесь .

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

Основываясь на данных Ильи, я написал библиотеку 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, Safari, Firefox, Opera на Mac. Пожалуйста, проверьте, работает ли он для вас.

Answer 5

Для людей, использующих jQuery, есть отличный плагин для обработки ключевых событий:

jQuery горячие клавиши на 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()