Back to Content

ClipboardChangeEvent

files/en-us/web/api/clipboardchangeevent/index.md

latest1.8 KB
Original Source

{{APIRef("Clipboard API")}}{{SeeCompatTable}}

The ClipboardChangeEvent interface of the {{domxref("Clipboard API", "", "", "nocode")}} represents events fired whenever the contents of the system clipboard are changed.

{{InheritanceDiagram}}

Constructor

  • {{domxref("ClipboardChangeEvent.ClipboardChangeEvent", "ClipboardChangeEvent()")}} {{experimental_inline}}
    • : Creates a new ClipboardChangeEvent event with the given parameters.

Instance properties

Also inherits properties from its parent {{domxref("Event")}}.

  • {{domxref("ClipboardChangeEvent.types")}} {{ReadOnlyInline}} {{experimental_inline}}
    • : An array of strings representing the mandatory data types available on the system clipboard when the event was fired.
  • {{domxref("ClipboardChangeEvent.changeId")}} {{ReadOnlyInline}} {{experimental_inline}}
    • : A 128-bit integer representing a unique identifier for this specific clipboard change operation.

Instance methods

No specific methods; inherits methods from its parent {{domxref("Event")}}.

Examples

In this example, when the clipboard's contents are changed, the event listener logs the data types, change id, and the entire event object to the console. This is a ClipboardChangeEvent object of type clipboardchange.

js
navigator.clipboard.addEventListener("clipboardchange", (event) => {
  console.log(`MIME types: ${event.types}`);
  console.log(`ID: ${event.changeId}`);
  console.dir(event);
});

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}

See also

  • Copy-related events: {{domxref("Element/copy_event", "copy")}}, {{domxref("Element/cut_event", "cut")}}, {{domxref("Element/paste_event", "paste")}}
  • {{domxref("ClipboardEvent")}}
  • Clipboard API