JS/jquery实现QQ、微信截图+页面粘贴【图片直接A
欢迎来到阿八个人博客网站。本 阿八个人博客 网站提供最新的站长新闻,各种互联网资讯。 喜欢本站的朋友可以收藏本站,或者加QQ:我们大家一起来交流技术! URL链接:https://www.abboke.com/jl/2018/1207/17.html
JS,jquery实现QQ、微信截图+页面粘贴【网站一键复制图片功能,复制出来的图片可以粘贴到微信和】
非常多盆友都觉得qq截图怎么上传的,其实也是非常简单的
document.addEventListener('paste', function (event) {
var items = (event.clipboardData || window.clipboardData).items;
var file = null;
if (items && items.length) {
// 搜索剪切板items
for (var i = 0; i < items.length; i++) {
if (items[i].type.indexOf('image') !== -1) {
file = items[i].getAsFile();
break;
}
}
} else {
log.innerHTML = '当前浏览器不支持';
return;
}
if (!file) {
log.innerHTML = '粘贴内容非图片';
return;
}
// 此时file就是我们的剪切板中的图片对象
// 如果需要预览,可以执行下面代码
var reader = new FileReader()
reader.onload = function(event) {
preview.innerHTML = '';
}
reader.readAsDataURL(file);
// 如果不需要预览,上面这段可以忽略
// 这里是上传
var xhr = new XMLHttpRequest();
// 上传进度
if (xhr.upload) {
xhr.upload.addEventListener('progress', function (event) {
log.innerHTML = '正在上传,进度:' + Math.round(100 * event.loaded / event.total) / 100 + '%';
}, false);
}
// 上传结束
xhr.onload = function () {
var responseText = xhr.responseText;
log.innerHTML = '上传成功,地址是:' + responseText;
};
xhr.onerror = function () {
log.innerHTML = '网络异常,上传失败';
};
xhr.open('POST', './upload.php', true);
xhr.setRequestHeader('FILENAME', encodeURIComponent(file.name));
xhr.send(file);
});
复制进html就可以用了,只需在php 文件写接收代码即可