We're looking for a person or people to help audit MDN to find places we could speed up. Is this you or someone you know? Check out the RFP: https://mzl.la/2IHcMiE

Nos bénévoles n'ont pas encore traduit cet article en Français. Inscrivez-vous et aidez-nous à réaliser cette tâche !
Vous pouvez également lire cet article en English (US).

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.


The onauxclick property is an EventHandler called when an auxclick event is sent, indicating that a non-primary button has been pressed on an input device (e.g. a middle mouse button).

This property is implemented as part of a plan to improve compatibility between browsers with regards to button behaviours — event behaviour is being updated so that click only fires for primary button clicks (e.g. left mouse button). Developers can then use auxclick to provide explicit behaviour for non-primary button clicks. Previous to this, click generally fired for clicks on all input device buttons, and browser behaviour was somewhat inconsistent.


element.onauxclick = functionRef(e);

The event handler function is a MouseEvent object. Apart from the button(s) the event is fired on, the behaviour is exactly the same.


In this example we define two event handler functions — onclick and onauxclick. The former changes the color of the button background, while the latter changes the button foreground (text) color. You can see the two functions in action by trying the demo out with a multi-button mouse (see it live on GitHub; also see the source code).

var button = document.querySelector('button');
var html = document.querySelector('html');

function random(number) {
  return Math.floor(Math.random() * number);

button.onclick = function() {
  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
  button.style.backgroundColor = rndCol;

button.onauxclick = function() {
  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
  button.style.color = rndCol;

Note: If you are using a three-button mouse, you'll notice that the onauxclick handler is run when either of the non-left mouse buttons are clicked.


The click event is raised when the user clicks on an element. The click event will occur after the mousedown and mouseup events.

Only one click handler can be assigned to an object at a time with this property. You may be inclined to use the EventTarget.addEventListener() method instead, since it is more flexible and part of the DOM Events specification.


onauxclick is not part of any official specification yet; the definition can be found in the auxclick Draft Community Group Report.

Browser Compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 55 53 (53) No support ? No support
Feature Android Android Webview Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support No support ? ? 53 (53) ? No support No support

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : ericwilligers, chrisdavidmills
 Dernière mise à jour par : ericwilligers,