Як зафіксувати командний ключ Mac через JavaScript?

Як можна захопити Cmdключ Mac через JavaScript?

EDIT: Станом на 2019 рік , e.metaKeyбуде підтримуватися на всіх основних браузерах , як в відповідно до MDN .

Зауважте, що в Windows, хоча ⊞ Windowsключ вважається "мета" клавішею, він не збирається захоплювати браузери як такі.

Це лише для командної клавіші на MacOS / клавіатурах.

На відміну від Shift/ Alt/ Ctrl, Cmdклавіша ("Apple") не вважається клавішею модифікатора - замість цього вам слід слухати keydown/ keyupзаписувати, коли натискати клавішу та потім натискати клавішу event.keyCode.

На жаль, ці ключові коди залежать від браузера:

• Firefox: 224
• Опера: 17
• Веб-браузери (Safari / Chrome): 91(команда зліва) або 93(команда праворуч)

Можливо, вам буде цікаво прочитати статтю JavaScript Madness: Keyboard Events , з якої я дізнався ці знання.

Ви також можете переглянути event.metaKeyатрибут події, якщо ви працюєте з подіями клавіш. Чудово працював для мене! Ви можете спробувати тут .

Я виявив, що ви можете виявити командний ключ в останній версії Safari (7.0: 9537.71), якщо його натиснути разом з іншою клавішею. Наприклад, якщо ви хочете виявити ⌘ + x:, ви можете виявити клавішу x і перевірити, чи встановлено значення true.metaKey. Наприклад:

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

Якщо натиснути x самостійно, це виведе 120, false. Якщо натиснути ⌘ + x, воно виведе120, true

Це, здається, працює в Safari - не в Chrome

Спираючись на дані Іллі, я написав бібліотеку 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. Перевірте, чи працює він для вас.

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

гарячі клавіші jQuery на GitHub

Для захоплення ⌘+ Sі Ctrl+ Sя використовую це:

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

Ось як я це зробив у 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()

якщо ви використовуєте Vuejs, просто зробіть його за допомогою плагіна vue-shortkey, все буде просто

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

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