Events

October 15, 2018 · View on GitHub

Adobe XD supports a subset of HTML events.

EventMDN Link
blurMDN docs
changeMDN docs
clickMDN docs
closeMDN docs
focusMDN docs
inputMDN docs
keydownMDN docs
loadMDN docs
messageMDN docs
pointerEnterMDN docs
pointerMoveMDN docs
pointerLeaveMDN docs
progressMDN docs
resizeMDN docs

The following event classes are supported by XD:

blur

Dispatched whenever the focus leaves the currently focused control. This can be useful if you want to validate the contents of a field immediately after entry.

element.addEventListener("blur", evt => {
    if (Number.isNaN(Number(evt.target.value))) {
        evt.target.value = "";
    }
});
  
Applies toFocusable controls (input elements, buttons)
SinceXD 13

change

Dispatched after the contents of an input control change. This event only occurs after the last input to the control; so you won't see an event for every key press or mouse move.

element.addEventListener("change", evt => {
    console.log(evt.target.data);
});
  
Applies toFocusable controls (input elements, buttons)
SinceXD 13

click

Dispatched when the user clicks or taps on the element.

Danger

Subsequent clicks may be ignored if they fall within the "double click" time span.

  
Applies toAll elements
SinceXD 13

close

Dispatched when a websocket is closed.

  
Applies toWebSocket
SinceXD 13

focus

Dispatched whenever a focusable control receives focus.

  
Applies toAll focusable controls (input elements, buttons)
SinceXD 13

input

Dispatched whenever there is input in an input control. This will fire with every change.

  
Applies toAll focusable controls (input elements, buttons)
SinceXD 13

keydown

Dispatched whenever a key is pressed.

  
Applies toAll focusable controls (input elements, buttons)
SinceXD 13

load

Dispatched when the element has loaded.

  
Applies toDialogs (HTMLDialogElement)
SinceXD 13

message

Dispatched when a websocket receives a message.

  
Applies toWebSocket
SinceXD 13

pointerEnter

Dispatched when the mouse cursor enters the element's bounds.

  
Applies toAll non-interactive elements. Interactive elements do not support pointer events.
SinceXD 13

pointerMove

Dispatched when the mouse cursor moves within the element's bounds.

  
Applies toAll non-interactive elements. Interactive elements do not support pointer events.
SinceXD 13

pointerLeave

Dispatched when the mouse cursor leaves the element's bounds.

  
Applies toAll non-interactive elements. Interactive elements do not support pointer events.
SinceXD 13

progress

Dispatched whenever there is some progress to report in an XMLHttpRequest transfer.

  
Applies toXMLHttpRequest
SinceXD 13

resize

Dispatched whenever a dialog is resized.

Info

Since dialogs cannot be currently resized, this event only fires once, when the dialog is made visible.

  
Applies toDialogs (HTMLDialogElement)
SinceXD 13