<html>
<head>
<title>chrome复制内容到剪贴板</title>
<style>
textarea{width:100%;height:150px;border:solid 1px #ccc;padding:1%;line-height:140%;box-sizing:border-box}
textarea:hover{border-color:#999;}
textarea:focus{border-color:#59f;}
#dest{border-color:#ccc;}
#copy1{display:none;}
#copytext{position:fixed;left:9999px;top:9999px;}
</style>
<script>
function $(id){return document.getElementById(id)}
function copy(id) {
var t = $(id).value;
if (t == '') return false;
$('copytext').innerHTML = t.replace(/\n/g, "<br>");
var element = $('copytext'), error = '浏览器不支持,请手动复制!';
if (document.body.createTextRange) {
var range = document.body.createTextRange();
range.moveToElementText(element);
range.select()
} else if (window.getSelection) {
var selection = window.getSelection(),
range = document.createRange();
range.selectNodeContents(element);
selection.removeAllRanges();
selection.addRange(range)
} else return alert(error);
try {
if (document.execCommand('copy', false, null)) {
$('copytip').innerHTML = '已复制!';
} else alert(error)
} catch(err) {
alert(error)
}
}
document.addEventListener("click", function(e){
if(e.target.id != 'copy') $('copytip').innerHTML = ''
}, false);
</script>
</head>
<body>
<div class="top"></div>
<div class="main" style="height: auto !important;">
<div class="title"><h1>chrome复制内容到剪贴板</h1></div>
<textarea name="dest" id="dest"></textarea>
<input type="button" id="copy" onclick="copy('dest')" value="复制">
<span id="copytip"></span>
<div id="copytext"></div>
<p> </p>
</div>
</html>