<input id="test" value="Test" disabled />
<a onclick="copy()">Button</a>

function copy(){
   var text = document.getElementById("test");

   text.select();
   document.execCommand("copy");

   console.log("Copied the text: " + text.value);
}

I have above function to copy my copy. But its not working.

<input id="test" value="Test" disabled />
<a onclick="copy()">Button</a>

function copy(){
   var text = document.getElementById("test");

   text.select();
   document.execCommand("copy");

   console.log("Copied the text: " + text.value);
}

I have above function to copy my copy. But its not working.

• javascript
• html

Share Improve this question Follow edited Apr 11, 2019 at 7:20 Cristal asked Apr 11, 2019 at 7:06 CristalCristal 50211 gold badge44 silver badges2323 bronze badges 4

• What do you mean by "not working"? What happens instead? if you know already that some browsers cannot handle that code properly, which are those? – Nico Haase Commented Apr 11, 2019 at 7:07
• The clipboard API is not available in all browsers, see caniuse./#feat=clipboard – Sarah Groß Commented Apr 11, 2019 at 7:08
• @Connum what would be to best solution to copy in all browser? – Cristal Commented Apr 11, 2019 at 7:12
• This SO should be linked here : stackoverflow./questions/47421025/… And also the best example of a plete working example that works on all devices is at: w3schools./howto/howto_js_copy_clipboard.asp It includes the import method that must be called for execCommand("copy") to work on mobile devices. – raddevus Commented Oct 24, 2020 at 20:45

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

There are a few issues with your code:

• disable attribute on the input has to actually be disabled
• when you set disabled on the input, you cannot select its text in order to copy it, so you might either want to use readonly in this case or set text.value manually via navigator.clipboard.writeText(text.value)
• The Clipboard API is not available in all browsers, see https://caniuse./#feat=clipboard. For a long time, people used Flash for clipboard operations, but with Flash support being removed from browsers, there are not any options left. However, there are libraries like clipboard.js that streamline clipboard operations across supported browsers.

function copy(){
   var text = document.getElementById("test");

   // set arbitrary value instead of current selection
   // to clipboard to make it work with a disabled input as well
   navigator.clipboard.writeText(text.value);

   // text.select();   
   //document.execCommand("copy");

   console.log("Copied the text: " + text.value);
}

function copy2(){
   var text = document.getElementById("test2");

   text.select();   
   document.execCommand("copy");

   console.log("Copied the text: " + text.value);
}

<input id="test" value="Test" disabled />
<a onclick="copy()">Button</a>
<hr>
<h3>using <code>document.execCommand("copy")</code></h3>
<input id="test2" value="Test2" readonly />
<a onclick="copy2()">Button</a>

You could use this clipboard.js library. It has a great browser support.