Javascript code for "Copy to Clipboard" won't work in Internet Explorer 11

Question

I have a piece of Javascript code that currently makes a call to a specific webpage, returns the data, then copies it to the clipboard. It's working in Chrome, Safari, and Firefox, but for some reason the copy functionality won't work in IE 11.

The response body is being returned with the correct data, but I can't seem to get that data to the clipboard. The code needs to be pure Javascript, as it's being utilized through a developer portal with some limitations/restrictions. In essence, I want to avoid importing jQuery libraries/using jQuery.

function httpGet(theUrl)
{
   if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
       xmlhttp=new XMLHttpRequest();
   }
   else
   {// code for IE6, IE5
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   xmlhttp.onreadystatechange=function()
   {
       if (xmlhttp.readyState==4 && xmlhttp.status==200)
       {
           function listener(e) {
             e.clipboardData.setData("text/html", xmlhttp.responseText);
             e.clipboardData.setData("text/plain", xmlhttp.responseText);
             e.preventDefault();
           }
           document.addEventListener("copy", listener);
           document.execCommand("copy");
           document.removeEventListener("copy", listener);

           return xmlhttp.responseText;
       }
   }
   xmlhttp.open("GET", theUrl, false );
   xmlhttp.send();
}

The function is being called in an "onclick" HTML event, which is firing normally from what I understand (considering the call to "theUrl" page is being made and returning data). Any input on why the clipboard isn't getting the data would be GREATLY appreciated. Thanks!

Possible duplicate of [Copy to clipboard option for IE9, IE11 and Safari](https://stackoverflow.com/questions/34434373/copy-to-clipboard-option-for-ie9-ie11-and-safari) — frodo2975, May 09 '19 at 15:56
The code needs to be pure Javascript, as it's being utilized through a developer portal with some limitations/restrictions. In essence, I want to avoid importing jQuery libraries/using jQuery. From what I understand, this utilizes a jQuery library. — Cloudfoot, May 09 '19 at 17:41
If you read through the code, the actual clipboard stuff is only pure JS. — frodo2975, May 09 '19 at 19:38

score 1 · Answer 1 · answered May 10 '19 at 07:08

In the IE browser, you could use the following code:

<script>
    function Copy() {
        if (window.clipboardData) {
            window.clipboardData.clearData();
            window.clipboardData.setData("Text", document.getElementById('txtacpy').value);
        }
        else {
            alert("not support window.cliboardData")
        }
    }
    function paste() {
        if (window.clipboardData) {
            document.getElementById('txtapaste').value = window.clipboardData.getData("Text");
        }
    }
</script>
<input type="button" id="btncopy" value="Copy" onclick="Copy()" />
<br />
<input type="text" name="txtacpy" id="txtacpy" />
<br />
<input type="button" id="btncopy" value="Paste" onclick="paste();" />
<br />
<input type="text" name="txtapaste" id="txtapaste" />

the result like this.

Note:The above code only works well in IE browser, so, you might need to check whether the browser is IE browser first, please check this thread and this thread.

score 0 · Answer 2 · answered May 09 '19 at 15:54

0

If it wasn't IE11 you could use ClipboardAPI, so then I would just use:

function copy() {
  const copyText = document.querySelector("#input");
  copyText.select();
  document.execCommand("copy");
}

document.querySelector("#copy").addEventListener("click", copy);

Hope it helps!

answered May 09 '19 at 15:54

Rafael Rocha

508
1
3
16

I appreciate the response, but I unfortunately need IE11 compatibility. – Cloudfoot May 09 '19 at 15:57
As mentioned above, the solution with the `document.exectCommand()` works on IE11, or at least it should. It isnt implementing the `ClipboardAPI`. – Rafael Rocha May 10 '19 at 11:27
Try this https://stackoverflow.com/a/57374062/8814510 works in all the browsers, IOS and Andriod. Also covered the scenario where the user denies permission to the clipboard. Additionally, the message "link copied" will be displayed even if the user copies manually. – Renga Aug 06 '19 at 12:44

Javascript code for "Copy to Clipboard" won't work in Internet Explorer 11

2 Answers2