收到个小需求,要求在页面上给个功能“复制”,一般网上使用flash复制API就够了,但这里要图片也要复制进去。
虽然是相当的无意义,但还是找了点资料在弄了,只支持IE,小小记录一下。
把这段代码复制到HTML里面就行了,可以图片和文字一起复制,然后在QQ窗口或WORD中CTRL+V,就可以贴入了。
缺点 是只支持IE,还是会弹个需要用户允许访问剪切板的提示。
<html>
<head>
<meta charset="utf-8" />
<title>IE复制点击后将文字复制到剪贴板,将图片复制到画图 . </title>
<style type="text/css">
</style>
</head>
<body>
<div id="copycontent">
<img src="https://www.xdnote.com/img/author.jpg" id="copyimage">
<p id="copytext">这里是我要复制的文字</p>
</div>
<br>
<input type="button" value="复制图片及文字" onclick="copyaction()">
<script TYPE="text/javascript">
function copyaction(){
if(document.body.createControlRange){
var div=document.getElementById('copycontent');
var copy=document.body.createControlRange();
copy.addElement(div);
copy.execCommand("Copy");
alert("复制完成!");
}else{
alert('浏览器不支持复制');
}
}
</script>
</body>
</html>
运行的结果如下:
这里是我要复制的文字