Copy a text when a link or button is clicked

Question

I am new to website development and try to figure out how can I make my user automatically copy a code in to his/her mouse(clip board) when clicked on a link (using html, php or javascript). For example, I am trying to create this personal website, when a user click on a link or a button in my website, it should automatically copy that text code to the clip board. I have seen sites like retailmenot.com do this: Example:- enter image description here

Please show me with an example if you can

Updated:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>


$("#link").click(function(){
  var holdtext = $("#clipboard").innerText;
  Copied = holdtext.createTextRange();
  Copied.execCommand("Copy");
});


</script>
</head>
<body>

<hr>
<a href="http://www.w3schools.com" style="font-family:arial;color:black;font-size:25px;">Click here to copy the Code</a> <button onclick="copyToClipboard()">Copy Text</button>
<hr>

</body>
</html>

I don't think Javascript has any built-in way to copy to/from the clipboard. There are some Flash-based solutions. — Barmar, Oct 26 '13 at 11:42
A long discussion: http://stackoverflow.com/questions/400212/how-to-copy-to-the-clipboard-in-javascript/ — Peter van der Wal, Oct 26 '13 at 11:43

Nikunj Dhimar · Answer 1 · 2016-08-09T07:38:36.387

Here is the function which might can help you or future referer.

    function copyToClipboard(id) {
    var text = $("#td_id_" + id).text(); //getting the text from that particular Row
    //window.prompt("Copy to clipboard: Ctrl+C, Enter", text);
    if (window.clipboardData && window.clipboardData.setData) {
        // IE specific code path to prevent textarea being shown while dialog is visible.
        return clipboardData.setData("Text", text); 

    } else if (document.queryCommandSupported && document.queryCommandSupported("copy")) {
        var textarea = document.createElement("textarea");
        textarea.textContent = text;
        textarea.style.position = "fixed";  // Prevent scrolling to bottom of page in MS Edge.
        document.body.appendChild(textarea);
        textarea.select();
        try {
            return document.execCommand("copy");  // Security exception may be thrown by some browsers.
        } catch (ex) {
            console.warn("Copy to clipboard failed.", ex);
            return false;
        } finally {
            document.body.removeChild(textarea);
        }
    }
  }

Unit test in all Browser not done.

score 1 · Answer 2 · answered Oct 26 '13 at 11:42

1

try this.

$("#link").click(function(){
  var holdtext = $("#clipboard").innerText;
  Copied = holdtext.createTextRange();
  Copied.execCommand("Copy");
});

answered Oct 26 '13 at 11:42

Manwal

23,450
12
63
93

This only works in IE ( http://stackoverflow.com/questions/21572682/createtextrange-is-not-woring-in-chrome ) – Lego Jul 25 '14 at 11:10

Copy a text when a link or button is clicked

2 Answers2

Linked