将本地图片复制或截图,然后粘贴到本地网页的代码
Admin | 2022-2-3 19:35:29 | 被阅次数 | 5695
下面的代码,可以实现的功能是:
复制本地图片然后粘贴到本地网页,并显示在网页的图像控件或canvas中。或者,截图之后粘贴到网页图像控件或canvas中。
function setPasteImg()
{
document.addEventListener('paste', function(event)
{
if (event.clipboardData || event.originalEvent)
{
var clipboardData = (event.clipboardData || event.originalEvent.clipboardData);
if(clipboardData.items)
{
var blob;
for (var i = 0; i < clipboardData.items.length; i++)
{
if (clipboardData.items[i].type.indexOf("image") !== -1)
{
blob = clipboardData.items[i].getAsFile();
}
}
var render = new FileReader();
render.onload = function (evt)
{
//输出base64编码
var base64 = evt.target.result;
document.getElementById('img').setAttribute('src',base64);
}
if(blob)
{
render.readAsDataURL(blob);
}
}
}
})
}
使用方法,直接调用函数即可。如:
setPasteImg();//最好将其放在文档加载完成后的地方。