How to Copy Text to Clipboard JavaScript

Hello Everyone hopes you all are doing well and today we talk about Copy Text to Clipboard JavaScript.

To copy any text or code we generally use CTRL+C from the keyboard. If you want to integrate functionality copy text to clipboard we use javascript and JS is the easiest option to build that functionality.

The DOM execCommand() function used to build Copy to Clipboard functionality. This Dom function executes a specific command to copy a particular document.

We also use the copy command with the document.execCommand() to copy the text to the clipboard.

On the below example, we will show you the functionality copy to clipboard with source code.

The following code snippet copies the text to the clipboard by using execCommand().

HTML

<input type="text" id="userInput" value="Welcome to PHPCODER">
<button onclick="copyText()">Copy text to Clipboard</button>

1 2	<input type="text" id="userInput" value="Welcome to PHPCODER"> <button onclick="copyText()">Copy text to Clipboard</button>

JavaScript Code To Copy Text to Clipboard

<script type="text/javascript">
function copyText(){
var text = document.getElementById("userInput");
text.select();
document.execCommand("copy");
alert("Copy text to Clipboard: " + text.value);
}
</script>

function copyText(){

var text = document.getElementById("userInput");

text.select();

document.execCommand("copy");

alert("Copy text to Clipboard: " + text.value);

}

</script>

To know more, HTML DOM execCommand() Method (w3schools.com)

Also check:

Happy Coding..!

Was this article helpful?

YesNo

How to Copy Text to Clipboard JavaScript

HTML

JavaScript Code To Copy Text to Clipboard

Written by Bikash

How To Stop Auto Page Refresh Using JavaScript

How to Use the Git Stash Command with example

5 Most Effective Ways To Optimize PHP Code

4 Replies to “How to Copy Text to Clipboard JavaScript”

Leave a Reply Cancel reply