简体   繁体   English

“复制到剪贴板”的Javascript代码在Internet Explorer 11中不起作用

[英]Javascript code for “Copy to Clipboard” won't work in Internet Explorer 11

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. 我有一段Javascript代码,当前调用特定的网页,返回数据,然后将其复制到剪贴板。 It's working in Chrome, Safari, and Firefox, but for some reason the copy functionality won't work in IE 11. 它适用于Chrome,Safari和Firefox,但出于某种原因,复制功能在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. 代码需要是纯Javascript,因为它是通过开发人员门户使用的,具有一些限制/限制。 In essence, I want to avoid importing jQuery libraries/using jQuery . 本质上, 我想避免使用jQuery导入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). 该函数正在“onclick”HTML事件中调用,该事件通常根据我的理解来触发(考虑到正在调用“theUrl”页面并返回数据)。 Any input on why the clipboard isn't getting the data would be GREATLY appreciated. 任何有关剪贴板未获取数据的输入都将非常受欢迎。 Thanks! 谢谢!

If it wasn't IE11 you could use ClipboardAPI , so then I would just use: 如果它不是IE11你可以使用ClipboardAPI ,那么我只会使用:

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

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

Hope it helps! 希望能帮助到你!

In the IE browser, you could use the following code: 在IE浏览器中,您可以使用以下代码:

<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 . 注意:以上代码仅适用于IE浏览器,因此,您可能需要先检查浏览器是否为IE浏览器,请检查此线程此线程

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM