前端頁面可能需要復制圖片到剪切板的功能，這里使用JavaScript來實現這一功能，兼容大部分瀏覽器

全部代碼

復制圖片到剪切板

????????????

復制圖片

var?SelectText?=?function?(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);

}

}

//復制圖片

var?copyImage?=?document.getElementById("linkCopyImage");

copyImage.onclick?=?function(e){

//Make?the?container?Div?contenteditable

$(".zf-mass-code-img").attr("contenteditable",?true);

//Select?the?image

SelectText($('.zf-mass-code-img').get(0));

//Execute?copy?Command

//Note:?This?will?ONLY?work?directly?inside?a?click?listenner

document.execCommand('copy');

//Unselect?the?content

window.getSelection().removeAllRanges();

//Make?the?container?Div?uneditable?again

$('.zf-mass-code-img').removeAttr("contenteditable");

//Success!!

alert('復制圖片成功');

}

ps: 需要部署到服務器才能預覽復制圖片效果

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的html5图片剪切板,JavaScript 网页端复制图片到剪切板的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。