Which key does the e.metaKey refer to in JavaScript MouseEvent?

Question

MouseEvent.metaKey doesn't seem to work. On both FireFox and Chrome, it returns false even if I hold the Win key while clicking:

MDN states:

The MouseEvent.metaKey read-only property returning a Boolean that indicates if the Meta key was pressed (true) or not (false) when the event occured.

Note: On Macintosh keyboards, this is the command key (⌘). On Windows keyboards, this is the windows key (⊞).

Browser Compatibility

MDN claims MouseEvent.metaKey is supported on FireFox and Chrome, but it's not working.

Which key does MouseEvent.metaKey refer to?

Why is the above code not working?

Answer 1

If you're asking which key you would have to press on a Windows system in order for the MouseEvent's metaKey property to be true, the answer is that it depends on the browser. And some Windows browsers simply don't support it and always return false or undefined.

I could not find an up-to-date chart of browser support for metaKey, though there is a really old one at QuirksMode.org.

If you are using jQuery, metaKey is one of the event properties that it normalizes for cross-browser compatibility.

If you need to implement a key + mouse event for some functionality on your website, I would use the Shift key, so that it works on all systems. (If you need more than one key option, I would suggest you rethink your design.)