Question

我需要创建一个脚本，将特定文本复制到剪贴板的用户（从任何设备/操作系统/浏览器）。我找到了JS ZeroClipboard的这个库。但我在javascript方面不是很好，所以我的问题是如何在我的脚本中使用这个或多或少像这样的库。

<p id="text">text to copy</p>
<button onclick="CopyToClipboard()">Copy</button>

<script>
   function CopyToClipboard(){
       What i put here?
   };
</script>

帮助使用zeroclipboard或任何其他更简单的方法来执行此操作？如果它可以适用于大多数设备，那将是很好的！非常感谢!!!

Answer 1

我认为这就是你要找的东西。无需使用插件即可完成您想要的简单操作。有一种方法可以让你复制文本'execCommand（“copy”）;'。

function myFunction() {
  var copyText = document.getElementById("myInput");
  copyText.select();
  document.execCommand("copy");
  alert("Copied the text: " + copyText.value);
}

<input type="text" value="This text is still being copied" style="display:none;" id="myInput">
<button onclick="myFunction()">Copy text</button>

Answer 2

如果您要复制p代码或div代码中的静态文字，请使用以下代码。

var selectText = document.getElementById('text');
var range = document.createRange();
range.selectNode(selectText);
window.getSelection().addRange(range);
document.execCommand('Copy');
window.getSelection().removeAllRanges();

表示您为文本创建范围并选择节点。
之后从该范围中选择。
最后执行命令Copy并清除范围。

如果要从输入框中复制文本，请使用以下..

  var selectText = document.getElementById('text');
  selectText.select();
  document.execCommand("copy");

Answer 3

我添加了评论来解释发生了什么。

＆＃13;

function CopyToClipboard() {
  // Get the desired text to copy
  var selectText = document.getElementById('text').innerHTML;
  // Create an input
  var input = document.createElement('input');
  // Set it's value to the text to copy, the input type doesn't matter
  input.value = selectText;
  // add it to the document
  document.body.appendChild(input);
  // call select(); on input which performs a user like selection  
  input.select();
  // execute the copy command, this is why we add the input to the document
  document.execCommand("copy");
  // remove the input from the document
  document.body.removeChild(input);
}

＆＃13;

<p id="text">text to copy</p>
<button onclick="CopyToClipboard()">Copy</button>

＆＃13;

复制到剪贴板静态文本？

3 个答案: