javascript copy url to clipboard with a click code example

Example 1: javascript copy to clipboard

<head><script>
function copyToCliBoard() {
  var copyText = document.getElementById("myInput");
  copyText.select();
  copyText.setSelectionRange(0, 99999); /* For mobile devices */
  document.execCommand("copy");
  alert("Copied the text: " + copyText.value);
}
</script></head>

<body>
<input type="text" value="Hello World" id="myInput">
<button onclick="copyToCliBoard()">Copy text</button>
</body>

Example 2: javascript copy to clipboard

var copyTextarea = document.getElementById("someTextAreaToCopy");
copyTextarea.select(); //select the text area
document.execCommand("copy"); //copy to clipboard

Example 3: javascript copy to clipboard

const copyToClipboard = () => {

  navigator.permissions.query({name: "clipboard-write"}).then(result => {
    if (result.state == "granted" || result.state == "prompt") {
      // write to the clipboard now
      updateClipboard('I copy this string');
    }
  });
};

const updateClipboard = (newClip) => {
  
  navigator.clipboard.writeText(newClip).then(() => {
    // clipboard successfully set
	console.log('success');
  }, () => {
    // clipboard write failed
    console.log('Failed to copy');
  });
};

const btn = document.getElementById('copy-button');

btn.addEventListener('click', copyHashtagToClipboard);

Tags:

Html Example