JavaScript DOM MouseEvent property: which
[this page | pdf | back links]
The which property
of MouseEvent
objects within the JavaScript
DOM (i.e.
events triggered by an action with the mouse) returns which mouse button was
pressed (its output is more consistent between browsers than the button
property).
EXAMPLE:
HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head></head>
<body>
Try clicking on this box:
<p style="background-color: yellow; border: 2px solid black; width: 200px; height: 100px;"
onmousedown="myOnmousedown(event)"><br><br></p>
MouseEvent outcomes are:<br><br>
altKey: <b id="mouse1"></b><br>
button (usually 0 = left, 1 = middle, 2 = right): <b id="mouse2"></b><br>
buttons (usually sum of 1 = left, 2 = right, 4 = middle, 8 = back, 16 = forward):
<b id="mouse3"></b><br>
clientX: <b id="mouse4"></b><br>
clientY: <b id="mouse5"></b><br>
ctrlKey: <b id="mouse6"></b><br>
detail: <b id="mouse7"></b><br>
metaKey: <b id="mouse8"></b><br>
pageX: <b id="mouse9"></b><br>
pageY: <b id="mouse10"></b><br>
relatedTarget: <b id="mouse11"></b><br>
screenX: <b id="mouse12"></b><br>
screenY: <b id="mouse13"></b><br>
shiftKey: <b id="mouse14"></b><br>
which: <b id="mouse15"></b><br>
<script>
function myOnmousedown(event) {
document.getElementById("mouse1").innerHTML = event.altKey;
document.getElementById("mouse2").innerHTML = event.button;
document.getElementById("mouse3").innerHTML = event.buttons;
document.getElementById("mouse4").innerHTML = event.clientX;
document.getElementById("mouse5").innerHTML = event.clientY;
document.getElementById("mouse6").innerHTML = event.ctrlKey;
document.getElementById("mouse7").innerHTML = event.detail;
document.getElementById("mouse8").innerHTML = event.metaKey;
document.getElementById("mouse9").innerHTML = event.pageX;
document.getElementById("mouse10").innerHTML = event.pageY;
document.getElementById("mouse11").innerHTML = event.relatedTarget;
document.getElementById("mouse12").innerHTML = event.screenX;
document.getElementById("mouse13").innerHTML = event.screenY;
document.getElementById("mouse14").innerHTML = event.shiftKey;
document.getElementById("mouse15").innerHTML = event.which;
}
</script>
</body>
</html>
|
NAVIGATION LINKS
Contents | Prev | Next | JavaScript DOM (and BOM)