如何在单击按钮时复制URL?

Nit*_*hya 4 html javascript php jquery web

我试图在单击按钮时复制URL。一些我曾尝试过但无法正常工作的方法。 http://www.w3schools.com/code/tryit.asp?filename=FAF25LWITXR5

function Copy() 
{
    var Url = document.createElement("textarea");
    Url.innerHTML = window.location.href;
    Copied = Url.createTextRange();
    Copied.execCommand("Copy");
}
Run Code Online (Sandbox Code Playgroud)
<div>
 <input type="button" value="Copy Url" onclick="Copy();" />
 <br />
 Paste: <textarea rows="1" cols="30"></textarea>
</div>
Run Code Online (Sandbox Code Playgroud)

Mr.*_*Web 15

您不应该execCommand再使用,已弃用,请使用ClipboardAPI:

let url = document.location.href

navigator.clipboard.writeText(url).then(function() {
    console.log('Copied!');
}, function() {
    console.log('Copy error')
});
Run Code Online (Sandbox Code Playgroud)

更多信息:https ://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API


Ang*_*elo 5

<html>
    <head>
        <title></title>
    </head>
    <script type="text/javascript">
        function Copy() 
            {
                    //var Url = document.createElement("textarea");
                    urlCopied.innerHTML = window.location.href;
                    //Copied = Url.createTextRange();
                    //Copied.execCommand("Copy");
            }
    </script>
    <body>
        <div>
            <input type="button" value="Copy Url" onclick="Copy();" />
            <br />
          
            Paste: <textarea id="urlCopied" rows="1" cols="30"></textarea>
        </div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)


Jyo*_*aja 5

无需创建新的textarea。尝试textarea通过提供一些id('url')使其存在。

这是工作示例

function Copy() {
  var Url = document.getElementById("url");
  Url.innerHTML = window.location.href;
  console.log(Url.innerHTML)
  Url.select();
  document.execCommand("copy");
}
Run Code Online (Sandbox Code Playgroud)
<div>
  <input type="button" value="Copy Url" onclick="Copy();" />
  <br /> Paste: <textarea id="url" rows="1" cols="30"></textarea>
</div>
Run Code Online (Sandbox Code Playgroud)