I have a web page that is using Javascript to detect whether the
Command key on the Mac is being pressed when the user clicks a link.
This works fine on Mozilla, but it appears that IE does not implement
the metaKey attribute on events (event.metaKey on Mozilla detects the
Command key). Here's some sample code:

<script>
  function ck(e) {
    alert(e.metaKey);
    if (e.metaKey) {
      alert("metaKey is true! You are pressing the Command key.")
    } else {
      alert("metaKey is false or undefined.");
    }
  }
</script>

<a href=# onclick="ck(event); return false;">press Command and click
here</a>

Is there a way to detect if the Command key is being pressed for IE
(on the Mac)?

My underlying goal is to intercept the click to do some processing,
but then to go to a certain url. If the Command key is not pressed,
then it just uses location.href = destination_url, which sends the
page to the url. If the Command key is pressed, I want to behave the
same way as Mac browsers do by default, which is to open the url in a
new window; in this case I use window.open(destination_url). For
various reasons, I cannot simply return "true" from the onClick in
order to follow the default url of the anchor tag. (I know that would
allow the browser to automatically open the url in the same or new
window depending on the modifier keys being pressed.)

I strongly suspect the event.ctrlKey is the one you want:


<script> 
  function ck(e) { 
    var ctrl = null;
    if (window.event) ctrl = event.ctrlKey;
    else if (e) ctrl=(Event.META_MASK || Event.CTRL_MASK)
    if (ctrl) { 
      alert("metaKey is true! You are pressing the Command key.") 
    } else { 
      alert("metaKey is false or undefined."); 
    } 
  } 
  document.onkeypress =ck;
  window.onkeypress =ck;
  if (document.layers || (document.getElementById && !document.all))
     document.captureEvents(Event.KEYPRESS);

</script> 

Please let me know if I am correct since I do not have access to a Mac.


Here are some interesting links I have come across recently.

Events — browser compatibility
http://www.xs4all.nl/~ppk/js/events_compinfo.html

Event Capturing - Netscape 4
http://www.xs4all.nl/~ppk/js/evcapnn4.html

Working with Javascript - Event Models
http://developer.apple.com/internet/javascript/eventmodels.html

Good luck,

mplungjan-ga

---

Clarification of Answer by mplungjan-ga on 15 May 2002 14:31 PDT

Oops - seems I broke your script making it work in netscape 4 :(

Here is the addition for Mozilla

<script> 
  function ck(e) { 
    var ctrl = null;
    if (window.event) ctrl = window.event.ctrlKey;
    else if (e) ctrl=(e.metaKey || e.ctrlKey);
    else if (e) ctrl=(Event.META_MASK || Event.CTRL_MASK)
    if (ctrl) { 
      alert("metaKey is true! You are pressing the Command key.") 
    } else { 
      alert("metaKey is false or undefined."); 
    } 
  } 
  document.onkeypress=ck;
  window.onkeypress=ck;
  window.onmousedown=ck;
  if (document.layers || (document.getElementById && !document.all)) {
     document.captureEvents(Event.KEYPRESS);
     document.captureEvents(Event.MOUSEDOWN);
  }
</script> 



http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-MouseEvent-metaKey

---

Clarification of Answer by mplungjan-ga on 15 May 2002 14:32 PDT

Last one before I go to bed!

  function ck(e) {  
    var ctrl = null; 
    if (window.event) ctrl = window.event.ctrlKey; 
    else if (e && document.getElementById) ctrl=(Event.META_MASK ||
Event.CTRL_MASK)
    else if (e && document.layers) ctrl=(e.metaKey || e.ctrlKey); 
    if (ctrl) {  
      alert("metaKey is true! You are pressing the Command key.")  
    } else {  
      alert("metaKey is false or undefined.");  
    }  
  }

---

Request for Answer Clarification by bay-ga on 15 May 2002 15:27 PDT

This is incorrect. ctrlKey does not detect the Mac Command key.
Neither does altKey or shiftKey.

(Aside: On the Mac, in either IE or Moz, control-click brings up the
context menu. So under normal circumstances ctrlKey doesn't even come
into play when the control key is being held down -- the event
bypasses the web page because of the context menu.)

---

Request for Answer Clarification by bay-ga on 15 May 2002 15:28 PDT

To clarify: I tested out event.ctrlKey independently, as well as the
code you posted; neither detects the Command key being pressed.

---

Clarification of Answer by mplungjan-ga on 17 May 2002 01:32 PDT

Glad to be of service!
This was my first answer under google (my 15.000 or so elsewehere ;-)

Michel

The actual solution was suggested by the answerer, but in the comments
section below. I put a comment there that has an example script that
solves the problem. Thanks!

I use a PC keyboard on my mac with a Belkin adaptor. The Alt key is
mapped to the command key. I wonder if you queried for the alt key if
IE would return true when actually pressing the command key?

IE property pages at msdn:

http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/ctrlkey.asp

Some more investigation reveals that IE4 on mac has some issues
http://www.webreference.com/js/column11/modifierkeys.html

Please run the following and see what it says in the status line (if
anything) when you press the meta key

<SCRIPT LANGUAGE="JavaScript"><!-- // cloak
/* Scan code program (c) 2000-2002 Michel Plungjan "michel at irt.org"
*/
ns4 = (document.layers) ?1:0;
ie4 = (document.all) ?1:0;
dom = (document.getElementsById) ?1:0;
if (ns4) document.captureEvents(Event.KEYDOWN);
document.onkeydown = keyDown;
window.onkeydown = keyDown;
function keyDown(e) {
   var keyPress = (ie4) ? window.event.keyCode : e.which ;
   shft = ((ns4) ? e.modifiers && Event.SHIFT_MASK   :
window.event.shiftKey) ? " shft " :"";
   alt  = ((ns4) ? e.modifiers && Event.ALT_MASK     :
window.event.altKey)   ? " alt "  :"";
   ctrl = ((ns4) ? e.modifiers && Event.CONTROL_MASK :
window.event.ctrlKey)  ? " ctrl " :"";
   meta = ((ns4) ? e.modifiers && Event.META_MASK    :
window.event.metaKey)  ? " meta " :"";
   var key = String.fromCharCode(keyPress);
   window.status= key + ' (' +keyPress + ') ' + shft + ' ' + alt + ' '
+ ctrl + ' ' + meta;
   return false;
}
// uncloak --></SCRIPT>

This is what is displayed in the status bar when I press the Mac
Command key with the above Javascript code:

  [ (91)

So looking for keycode 91 does seem to be a reliable way of detecting
the Command keypress itself. Great! This code then does exactly what I
needed:

<script>
// simplified to handle IE only

var commandkey = false;

function keyDown() { 
  if (event.keyCode == 91) commandkey = true;
}
document.onkeydown = keyDown; 

function keyUp() {
  if (event.keyCode == 91) commandkey = false;
}
document.onkeyup = keyUp; 

function checkcommand() {
  alert(commandkey ? "command key pressed!" : "command key NOT
pressed");
}
</script>

<a href=# onclick="checkcommand()">click me</a>

Asides: For IE-Windows, this detects whether the Windows key is being
pressed. There is a danger of the commandkey variable getting out of
sync with the actual state of the commandkey if the focus is not on
the browser window when the command key is pressed or released.

Thanks mplungjan.