Javascript Copy to Clipboard from div Example

Jun 04, 2021 . Admin

Hello Friends,

Now let's see example of how to copy to clipboard from div in javascript. Here you will learn how to use javascript copy to clipboard from div. We will use how to copy to clipboard from div in javascript. This is a short guide on copy to clipboard from div. Let's get started with how to copy to clipboard from div in javascript.

Here i will give you many example how you can copy to clipboard from div in javascript.

Example : 1
<!DOCTYPE html>
<html>
	<head>
	   <title>Javascript - How to copy to clipboard?-MyWebtuts.com</title>
	   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
	</head>
	<body>
		<div id="demo" onclick="test()"><h3><span class="label label-info">Click to copy</span></h3></div>
        <script>
            function test() {
                var range = document.createRange();
                range.selectNode(document.getElementById("demo"));
                window.getSelection().removeAllRanges(); // clear current selection
                window.getSelection().addRange(range); // to select text
                document.execCommand("copy");
                window.getSelection().removeAllRanges();// to deselect
            	alert("Copy to Clipboard Successfully");
            }
        </script>
	</body>
</html>
Output : 1 
Click to copy
Example : 2 
<!DOCTYPE html>
<html>
    <head>
       <title>Javascript - How to copy to clipboard?-MyWebtuts.com</title>
       <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    </head>
    <body>
        <div id="stud" onclick="clip()"><h3><span class="label label-info">YES THIS DIV TEXT TO COPY</span></h3></div>
        <script>
            function clip() {
                var range = document.createRange();
                range.selectNode(document.getElementById("stud"));
                window.getSelection().removeAllRanges(); // clear current selection
                window.getSelection().addRange(range); // to select text
                document.execCommand("copy");
                window.getSelection().removeAllRanges();// to deselect
                alert("Copy to Clipboard Successfully");
            }
        </script>
    </body>
</html>
Output : 2 
YES THIS DIV TEXT TO COPY
It will help you....
#Javascript

You might also like...