How does one capture a Mac s command key via JavaScript

Question

How does one capture a Mac s Cmd key via JavaScript

User · Answer

if you use Vuejs  just make it by vue-shortkey plugin  everything will be simple  https   www npmjs com package vue-shortkey  v-shortkey    meta    enter       shortkey  metaEnterTrigged

User · Answer

You can also look at the event metaKey attribute on the event if you are working with keydown events  Worked wonderfully for me  You can try it here

User · Answer

EDIT  As of 2019  e metaKey is supported on all major browsers as per the MDN   Note that on Windows  although the   Windows key is considered to be the  meta  key  it is not going to be captured by browsers as such   This is only for the command key on MacOS keyboards     Unlike Shift Alt Ctrl  the Cmd     Apple     key is not considered a modifier key   instead  you should listen on keydown keyup and record when a key is pressed and then depressed based on event keyCode   Unfortunately  these key codes are browser-dependent    Firefox  224 Opera  17 WebKit browsers  Safari Chrome   91  Left Command  or 93  Right Command    You might be interested in reading the article JavaScript Madness  Keyboard Events  from which I learned that knowledge

User · Answer

Here is how I did it in AngularJS app   angular module  MM Graph    class Keyboard   constructor    injector - gt         injector     injector        window         injector get   window                                 get reference to  window and  rootScope objects        rootScope      injector get   rootScope      on Key Down   event   gt         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      gt      angular element    window  bind  quot keydown quot     on Key Down                hook keydown event in window  only called once per app load         app service  keyboard     injector   gt    return new Keyboard  injector  setup Hooks

User · Answer

var element     the DOM element to listen for the key on  element onkeyup   function e       if e metaKey            command key was pressed

User · Answer

Basing on Ilya s data  I wrote a Vanilla JS library for supporting modifier keys on Mac  https   github com MichaelZelensky jsLibraries blob master macKeys js  Just use it like this  e g    document onclick   function  event      if  event shiftKey    macKeys shiftKey          do something interesting         Tested on Chrome  Safari  Firefox  Opera on Mac  Please check if it works for you

User · Answer

I found that you can detect the command key in the latest version of Safari  7 0  9537 71  if it is pressed in conjunction with another key  For example  if you want to detect   x   you can detect the x key AND check if event metaKey is set to true  For example   var key   event keyCode    event charCode    0  console log key  event metaKey     When pressing x on it s own  this will output 120  false  When pressing   x  it will output 120  true  This only seems to work in Safari - not Chrome

User · Answer

For people using jQuery  there is an excellent plugin for handling key events   jQuery hotkeys on GitHub  For capturing   S and Ctrl S I m using this     window  bind  keydown ctrl s keydown meta s   function event        event preventDefault           Do something here

[javascript] How does one capture a Mac's command key via JavaScript?

Examples related to javascript

Examples related to dom-events