Event altKey ctrlKey shiftKey attribute resolution

The event, altKey
Function: detects whether Alt is being held while the event is happening.

Grammar: event. AltKey

Value: true | false

Description:

An altKey attribute of true indicates that the Alt key was pressed and held when the event occurred, and false indicates that the Alt key was not pressed.
The altKey attribute can be used in conjunction with a mouse or keyboard to make shortcuts.

Event. CtrlKey
Function: detects if the Ctrl key is being held while the event is happening.

Grammar: event. CtrlKey

Value: true | false

Description:

A ctrlKey property of true means that the Ctrl key was pressed and held while the event occurred, or false means that the Ctrl key was not pressed.
The ctrlKey property can be used in conjunction with a mouse or keyboard to make shortcuts.

Event. ShiftKey
Function: detects if the Shift key is being held while the event is happening.

Grammar: event. ShiftKey

Value: true | false

Description:

A shiftKey property of true means that the Shift key is pressed and held when the event occurs, or false means that the Shift key is not pressed.
The shiftKey property can be used in conjunction with the mouse or keyboard to make shortcuts.

  Example 1
Composite action example.

<input id="txt1" type="text" value="Hello World!" onclick="checkAlt(event)" />
<script type="text/javascript">
function checkAlt(oEvent)
{
  if( oEvent.altKey )
    document.getElementById("txt1").select();
}
</script> 

The effect of this code is:  

If you hold Alt and click the text box above, you can select the text in the text box.

  Example 2
Composite action example.

<input id="txt2" type="text" value="Hello World!" onclick="clearText(event)" />
<script type="text/javascript">
function clearText(oEvent)
{
  if( oEvent.ctrlKey && oEvent.keyCode==46 )
    document.getElementById("txt2").value = "";
}
</script> 

The effect of this code is:  

Use the "Ctrl+Del" key combination to clear the above text box. The text box must first get focus. This example is for Internet explorer only.

  Example 3
Composite action example.

<div id="box" style="width:50px; height:25px;border:1px solid black; background-color:red" onclick="setColor(event)"></div>
<script type="text/javascript">
var b = true;
function setColor(oEvent)
{
  if( oEvent.shiftKey && b )
    document.getElementById("box").style.backgroundColor = "blue";
  if( oEvent.shiftKey && !b )
    document.getElementById("box").style.backgroundColor = "red";
  b = !b;
}
</script> 

The effect of this code is:

Hold down the "Shift" key and click the color block above to change the color block