onpaste Event

Definition and Usage

The onpaste event occurs when the user pastes content into an element.

Although all HTML elements support the onpaste event, it is actually impossible to paste content into elements like <p> unless the element has contenteditable set to "true" (see more examples below).

Tip: The onpaste event is mainly used for <input> elements with type="text".

Tip:Content can be pasted into an element in three ways:

  • CTRL + V
  • Select paste from the browser's edit menu
  • Select the paste command from the right-click menu

Example

Example 1

Execute JavaScript when pasting text into an <input> element:

<input type="text" onpaste="myFunction()" value="Paste something in here">

Try It Yourself

Example 2

Execute JavaScript when pasting text into a <p> element (note that contenteditable is set to "true"):

<p contenteditable="true" onpaste="myFunction()">Try to paste something inside this paragraph.</p>

Try It Yourself

Syntax

In HTML:

<element onpaste="myScript">

Try It Yourself

In JavaScript:

object.onpaste = function(){myScript};

Try It Yourself

In JavaScript, use the addEventListener() method:

object.addEventListener("paste", myScript);

Try It Yourself

Note:Internet Explorer 8 or earlier versions do not support addEventListener() Method.

Technical Details

Bubble: Support
Cancellable: Support
Event Type: ClipboardEvent
Supported HTML Tags: All HTML Elements

Browser Support

Events Chrome IE Firefox Safari Opera
onpaste Support Support Support Support Support

Related Pages

HTML DOM Reference Manual:oncopy Event

HTML DOM Reference Manual:oncut Event