html tutorial - onpaste Attribute in HTML - html5 - html code - html form



Onpaste attribute in html

Learn html - html tutorial - Onpaste attribute in html - html examples - html programs

  • The onpaste attribute triggers when the user paste certain contents.
  • The onpaste attribute is an Event attribute.

Syntax for onpaste attribute in HTML:

<element onpaste="script">

Applies To:

Element Attribute
All HTML Elements onpaste

Attribute Values:

Value Description
script The script to be run on onpaste.

Sample Coding for onpaste Attribute in HTML:

Tryit<!DOCTYPE html>
<html>
    <body>
       <center>
       <input type="text" onpaste="process()"value="paste your text here" size="40">
       </center>
       <p id="sample">
       </p>
       <script>
            function process() 
            {
                document.getElementById("sample").innerHTML = "Your text is pasted!";
            }
       </script>
    </body>
</html>

Code Explanation for onpaste Attribute in HTML:

onpaste  Attribute Code Explanation

  1. The onpaste attribute is used to call the process() JavaSript function, when user paste some text as input.
  2. The process() JavaScript function used to display “Your text is pasted!” in a <p> tag which has id as “sample”.

Output for onpaste Attribute in HTML:

onpaste Attribute Tag Output

  1. Here the <input> element text box shows that paste your text here, when the HTML page was load.
onpaste Attribute Tag Output

  1. When user paste the text Wikitechy in the input field then “Your text is pasted!” text is displayed.

Browser Support for onpaste Attribute in HTML:

Yes Yes Yes Yes Yes

Tips and Notes

  • It can support all HTML elements, but it is not possible to paste some contents, eg. <p> element, except the element has set contenteditable to “true”.
  • The onpaste attribute is typically used on <input> elements and its type is text.

Related Searches to onpaste Attribute in html