In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > event handling > events > onbeforepaste

onbeforepaste event | beforepaste event

Browser support:

Occurs before the contents of the clipboard are pasted into the document and provides a possibility to enable the Paste menu item.

The onbeforepaste event is useful if you want to enable the Paste menu item for a non-editable element (textarea, input:text, input:file and input:password) in a non-editable region (see the contentEditable and designMode properties). To enable the Paste menu item for an element, return false from an event handler for the onbeforepaste event on it.

In Internet Explorer, if the user selects the Paste menu item for a non-editable content, the onpaste event is fired and the contents of the clipboard are pasted.
In Google Chrome and Safari, the onpaste event is fired but the contents of the clipboard are not pasted.

If you want to implement the functionality of the Paste operation in Google Chrome and Safari, see the page for the clipboardData object. It contains a cross-browser example that shows how to access the clipboard. To remove the contents of the selection from the document, use the deleteFromDocument method.

In Internet Explorer, the onbeforepaste event occurs on the deepest element in the DOM hierarchy that contains the entire selection or the caret.
In Google Chrome and Safari, the onbeforepaste event occurs on the deepest element in the DOM hierarchy that contains the start point of the selection or the caret.

How to register:

In HTML:

In JavaScript:

object.onbeforepaste = handler;

object.addEventListener ("beforepaste", handler, useCapture);

9

object.attachEvent ("onbeforepaste", handler);

You can find the related objects in the Supported by objects section below.

The event object is accessible to all event handlers in all browsers. The properties of the event object contain additional information about the current event. To get further details about these properties and the possible event handler registration methods, please see the page for the event object.

For a complete list of events, see the page for Events in JavaScript.

Basic information:

Bubbles

Yes

Cancelable

Yes

Event object

DragEvent

9

Event

Actions that invoke the onbeforepaste event:

Pressing CTRL + V.
Opening the Edit menu.
Opening the context menu (right mouse click).

Events related to the clipboard:

onbeforecopy, onbeforecut, onbeforepaste, oncopy, oncut, onpaste.

Example HTML code 1:

This example shows how to enable the Paste menu item for a non-editable content:

<head>
    <script type="text/javascript">
        function EnablePaste () {
            return false;   // enable the Paste menu item
        }

        function OnPaste () {
            if (window.clipboardData) {
                window.clipboardData.setData ("Text", "My clipboard data");
            }
        }
    </script>
</head>
<body>
    <div onbeforepaste="return EnablePaste ()" onpaste="OnPaste ()">
        Select some text on this page and use the Paste menu item in the Edit menu 
        or in the context menu (right mouse click) to paste the 'My clipboard data'
        text into the document.
        In Google Chrome and Safari, no content will be pasted.
    </div>
</body>