单击按钮使用jQuery复制到剪贴板

本文翻译自：Click button copy to clipboard using jQuery

How do I copy the text inside a div to the clipboard? 如何将div中的文本复制到剪贴板？ I have a div and need to add a link which will add the text to the clipboard. 我有一个div，需要添加一个链接，该链接会将文本添加到剪贴板。 Is there a solution for this? 有解决方案吗？

<p class="content">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>

<a class="copy-text">copy Text</a>

After I click copy text, then I press Ctrl + V , it must be pasted. 单击复制文本后，然后按Ctrl + V ，必须将其粘贴。

---

#1楼

参考：https://stackoom.com/question/1WkRF/单击按钮使用jQuery复制到剪贴板

---

#2楼

Edit as of 2016 截至2016年编辑

As of 2016, you can now copy text to the clipboard in most browsers because most browsers have the ability to programmatically copy a selection of text to the clipboard using document.execCommand("copy") that works off a selection. 从2016年开始，您现在可以在大多数浏览器中将文本复制到剪贴板，因为大多数浏览器都可以使用可以关闭选择内容的document.execCommand("copy")以编程方式将文本的选择复制到剪贴板。

As with some other actions in a browser (like opening a new window), the copy to clipboard can only be done via a specific user action (like a mouse click). 与浏览器中的某些其他操作（例如，打开新窗口）一样，只能通过特定的用户操作（例如，单击鼠标）将内容复制到剪贴板。 For example, it cannot be done via a timer. 例如，它不能通过计时器来完成。

Here's a code example: 这是一个代码示例：

 document.getElementById("copyButton").addEventListener("click", function() { copyToClipboard(document.getElementById("copyTarget")); }); function copyToClipboard(elem) { // create hidden text element, if it doesn't already exist var targetId = "_hiddenCopyText_"; var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA"; var origSelectionStart, origSelectionEnd; if (isInput) { // can just use the original source element for the selection and copy target = elem; origSelectionStart = elem.selectionStart; origSelectionEnd = elem.selectionEnd; } else { // must use a temporary form element for the selection and copy target = document.getElementById(targetId); if (!target) { var target = document.createElement("textarea"); target.style.position = "absolute"; target.style.left = "-9999px"; target.style.top = "0"; target.id = targetId; document.body.appendChild(target); } target.textContent = elem.textContent; } // select the content var currentFocus = document.activeElement; target.focus(); target.setSelectionRange(0, target.value.length); // copy the selection var succeed; try { succeed = document.execCommand("copy"); } catch(e) { succeed = false; } // restore original focus if (currentFocus && typeof currentFocus.focus === "function") { currentFocus.focus(); } if (isInput) { // restore prior selection elem.setSelectionRange(origSelectionStart, origSelectionEnd); } else { // clear temporary content target.textContent = ""; } return succeed; } 

 input { width: 400px; } 

 <input type="text" id="copyTarget" value="Text to Copy"> <button id="copyButton">Copy</button><br><br> <input type="text" placeholder="Click here and press Ctrl-V to see clipboard contents"> 

---

Here's a little more advanced demo: https://jsfiddle.net/jfriend00/v9g1x0o6/ 这是一个更高级的演示： https : //jsfiddle.net/jfriend00/v9g1x0o6/

And, you can also get a pre-built library that does this for you with clipboard.js . 而且，你还可以得到一个预建库，以做到这一点你clipboard.js 。

---

Old, historical