Copy text of a specific tag to clipboard using JavaScript

Viewed 10747

I want to copy input to my clipboard using javascript so is there any way I can do,Thanks

WITHOUT MAKING AN INPUT FIELD

JavaScript And HTML

function copy(input){
  
}
<p>Text To Copy = hi <button type="button" onclick="copy('hi')">click to copy</button></p>

3 Answers

You can use navigator.clipboard.writeText to copy the text to clipboard.

function copy(input) {
  if (navigator.clipboard) {
    navigator.clipboard.writeText(input).then(() => {
      console.log('Copied to clipboard successfully.');
    }, (err) => {
      console.log('Failed to copy the text to clipboard.', err);
    });
  } else if (window.clipboardData) {
    window.clipboardData.setData("Text", input);
  }
}
<p>Text To Copy = hi <button type="button" onclick="copy('hi')">click to copy</button></p>

function copy_text_fun() {
    //getting text from P tag
    var copyText = document.getElementById("copy_txt");  
    // creating textarea of html
    var input = document.createElement("textarea");
    //adding p tag text to textarea 
    input.value = copyText.textContent;
    document.body.appendChild(input);
    input.select();
    document.execCommand("Copy");
    // removing textarea after copy
    input.remove();
    alert(input.value);
}
<p id="copy_txt">hi</p>
<button  onclick="copy_text_fun()">Copy</button>

here is with the paragraph tag,

Please try this. Maybe it will work for you.

 function myFunction() {
      /* Get the text field */
      var copyText = document.getElementById("myInput");
    
      /* Select the text field */
      copyText.select();
      copyText.setSelectionRange(0, 99999); /*For mobile devices*/
    
      /* Copy the text inside the text field */
      document.execCommand("copy");
    
      /* Alert the copied text */
      alert("Copied the text: " + copyText.value);
    }
 <input type="text" value="Hello World" id="myInput">
    <button onclick="myFunction()">Copy text</button>

   

Related