方法一：使用ZeroClipboard.js插件
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<input type="text">
<script type="text/javascript" src="dist/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="dist/ZeroClipboard.min.js"></script>
<div contenteditable="true" style="200px;height: 400px;border:1px solid red"></div>
<div id="content" >
<p>99u999999</p>
<a><img src="http://app1.xesimg.com/roommsg/ab78423e59a018f0adaa212a3998a15a_small.jpg" alt="" data-url="http://app1.xesimg.com/roommsg/ab78423e59a018f0adaa212a3998a15a_big.jpg" class="img-rounded img-thumbnail"></a>
</div>
<div>ddd</div>
<input id="copy" type="button" data-clipboard-text="复制文本" value="复制固定文本内容">
<input id="copyHtml" type="button" data-clipboard-target="content" value="复制一个id中的所有html内容">
<script type="text/javascript">
new ZeroClipboard( document.getElementById("copy") );
new ZeroClipboard( document.getElementById("copyHtml") );
</script>
</body>
</html>
方法二：使用document.execCommand('copy');
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS复制功能</title>
<style>
*{
margin:0;
padding:0;
}
input{
border:1px solid #ccc;
padding: 5px;
200px;
}
button{
height:32px;
}
</style>
</head>
<body>
<div style=" 400px;height: 200px;border: 1px solid red" contenteditable="true"></div>
<input type="text" placeholder="里面输入文字" value="复制文本域中的内容">
<div id="copyContent">复制非文本域的元素内容<p><a href="###">链接</a></p></div>
<button id="copyInput" type="button">点击复制</button>
<button id="noInput" type="button">点击复制非文本框文本域的元素</button>
</body>
</html>
<script type="text/javascript" src='http://libs.baidu.com/jquery/2.0.0/jquery.js'></script>
<script>
$(document).ready(function(){
//复制文本域中的内容
$('#copyInput').click(function(){
$('input').select();
document.execCommand('copy');
//alert('复制文本域中的内容')
})
//复制非文本域的元素内容
$('#noInput').click(function(){
//狐火浏览器下会把外层的id元素也复制进去，容易造成错误，所以需要区分copy内容的id的范围 ,但是目前没有找到区分的方法，即使在copyContent外 加一层居然也会把加的那层也复制进去
SelectText('copyContent');
document.execCommand('copy');
//alert('复制非文本域的元素内容')
})
})
function SelectText(element) {
var browserName=navigator.userAgent.toLowerCase();
var text = document.getElementById(element);
if (/msie/i.test(browserName) && !/opera/.test(browserName)) {
var range = document.body.createTextRange();
range.moveToElementText(text);
range.select();
} else {
var selection = window.getSelection();
var range = document.createRange();
range.selectNodeContents(text);
selection.removeAllRanges();
selection.addRange(range);
//苹果浏览器下，现已经不支持html的内容
// var selection = window.getSelection();
// selection.setBaseAndExtent(text, 0, text, 1);
}
}
</script>