更新2020：此解决方案使用execCommand。尽管在编写此答案时该功能还不错，但现在认为它已过时了。它仍然可以在许多浏览器上运行，但是不建议使用它，因为可能会放弃支持。
还有另一种非Flash方式（除了jfriend00的答案中提到的Clipboard API）。您需要选择文本，然后执行命令以将页面上当前选择的任何文本复制到剪贴板。copy
例如，此函数会将传递的元素的内容复制到剪贴板（根据PointZeroTwo的注释中的建议进行更新）：
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
}
它是这样工作的：
- 创建一个临时隐藏的文本字段。
- 将元素的内容复制到该文本字段。
- 选择文本字段的内容。
- 执行命令副本，例如：
document.execCommand("copy")。
- 删除临时文本字段。
您可以在此处查看快速演示：
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p id="p1">P1: I am paragraph 1</p>
<p id="p2">P2: I am a second paragraph</p>
<button onclick="copyToClipboard('#p1')">Copy P1</button>
<button onclick="copyToClipboard('#p2')">Copy P2</button>
<br/><br/><input type="text" placeholder="Paste here for test" />
主要问题是，目前并非所有浏览器都支持此功能，但您可以从以下主要途径使用它：
- 镀铬43
- Internet Explorer 10
- Firefox 41
- Safari 10
更新1：这也可以使用纯JavaScript解决方案（没有jQuery）实现：
function copyToClipboard(elementId) {
// Create a "hidden" input
var aux = document.createElement("input");
// Assign it the value of the specified element
aux.setAttribute("value", document.getElementById(elementId).innerHTML);
// Append it to the body
document.body.appendChild(aux);
// Highlight its content
aux.select();
// Copy the highlighted text
document.execCommand("copy");
// Remove it from the body
document.body.removeChild(aux);
}
<p id="p1">P1: I am paragraph 1</p>
<p id="p2">P2: I am a second paragraph</p>
<button onclick="copyToClipboard('p1')">Copy P1</button>
<button onclick="copyToClipboard('p2')">Copy P2</button>
<br/><br/><input type="text" placeholder="Paste here for test" />
注意，我们传递的ID现在没有＃号。
正如madzohan在以下评论中所报告的那样，在某些情况下（本地运行文件），64位版本的Google Chrome浏览器存在一些奇怪的问题。上面的非jQuery解决方案似乎已解决了该问题。
Madzohan在Safari中进行了尝试，该解决方案有效，但使用document.execCommand('SelectAll')而不是使用.select()（如聊天室和以下注释中所指定）。
正如PointZeroTwo在注释中指出的那样，可以改进代码，以便返回成功/失败结果。您可以在上看到一个演示此jsFiddle。
更新：保留文本格式
正如用户在西班牙语版本的StackOverflow中指出的那样，上面列出的解决方案如果您想按字面意义复制元素的内容，则可以完美地工作，但是，如果您想将复制的文本粘贴为格式（如它被复制到input type="text"，格式为“丢失”）。
一种解决方案是将其复制到可编辑的内容中div，然后execCommand以类似方式使用进行复制。这里有一个例子-单击复制按钮，然后粘贴到下面的内容可编辑框中：
function copy(element_id){
var aux = document.createElement("div");
aux.setAttribute("contentEditable", true);
aux.innerHTML = document.getElementById(element_id).innerHTML;
aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)");
document.body.appendChild(aux);
aux.focus();
document.execCommand("copy");
document.body.removeChild(aux);
}
#target {
width:400px;
height:100px;
border:1px solid #ccc;
}
<p id="demo"><b>Bold text</b> and <u>underlined text</u>.</p>
<button onclick="copy('demo')">Copy Keeping Format</button>
<div id="target" contentEditable="true"></div>
在jQuery中，它将是这样的：
function copy(selector){
var $temp = $("<div>");
$("body").append($temp);
$temp.attr("contenteditable", true)
.html($(selector).html()).select()
.on("focus", function() { document.execCommand('selectAll',false,null); })
.focus();
document.execCommand("copy");
$temp.remove();
}
#target {
width:400px;
height:100px;
border:1px solid #ccc;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p id="demo"><b>Bold text</b> and <u>underlined text</u>.</p>
<button onclick="copy('#demo')">Copy Keeping Format</button>
<div id="target" contentEditable="true"></div>