一个很奇葩的需求

生成了一张图片后，在图片下有个按钮，点一下就复制到了粘贴板

一开始先找到了clipboard.js  但是它只能复制文字

把图片的base64地址码复制了然后再编码成图片？

然后到so、git上问，找到了一个demo

点击一下图片就复制到了粘贴板

详情见   20180409笔记

-----------------------------------demo的github地址，见文章底部-------------------------------------------

4-16

对目前找到的代码，做一个总结

主函数

SelectText(element) {

var doc = document;

if (doc.body.createTextRange) {

var range = document.body.createTextRange();

range.moveToElementText(element);

range.select();

} else if (window.getSelection) {

var selection = window.getSelection();

var range = document.createRange();

range.selectNodeContents(element);

selection.removeAllRanges();

selection.addRange(range);

console.log(selection);

}

},

//点击按钮复制电子凭证，需要后期把图片上传到服务器上

copycert() {

$(".canvasImg").attr("contenteditable", true);

// console.log($(".canvasImg")); // '.canvasImg' 是类名 选id就是#

// console.log('1111');

// console.log($(canvasImg));

//console.log('2222');

this.SelectText($(".canvasImg").get(0)); //取第一位 this调用了实例上的东西

// console.log($("#canvasImg").get(0));

// console.log(document.execCommand("copy"));

// console.log(document.execCommand("copy"));

// alert("12345");

document.execCommand("copy");

window.getSelection().removeAllRanges();

$(".canvasImg").removeAttr("contenteditable");

alert("image copied!");

},

如果   

document.getElementById("canvasImg").src =

base64_img;

这样就不行，因为base64的格式不对

如果附一张图片连接给过去

/document.getElementById("canvasImg").src = 'http://img.taopic.com/uploads/allimg/120727/201995-120HG1030762.jpg';

就可以实现通过按钮复制图片了，

后期需要再做图片上传、保存到服务器

成品demo到仓库去找吧

https://github.com/herylee/vue-button-copy-pic-to-clickboard