javascript实现粘贴qq截图功能（clipboardData）
这篇文章主要介绍了在网页中实现读取剪贴板粘贴截图功能,即可以把剪贴板的截图Ctrl+V粘贴到网页的一个输入框中,例如QQ截图、旺旺截图或者其它截图软件。具体代码如下。
<!DOCTYPEHTML>
<htmllang="en-US">
<head>
<metacharset="UTF-8">
<title>利用clipboardData在网页中实现截屏粘贴的功能</title>
<styletype="text/css">
#box{width:200px;height:200px;border:1pxsolid#ddd;}
</style>
</head>
<body>
<h1>利用clipboardData在网页中实现截屏粘贴的功能</h1>
<hr/>
<div><inputtype="text"id="testInput"placeholder="截屏后粘贴到输入框中"size="30"/></div>
<scripttype="text/javascript">
(function(){
varimgReader=function(item){
varblob=item.getAsFile(),
reader=newFileReader();
//读取文件后将其显示在网页中
reader.onload=function(e){
varimg=newImage();
img.src=e.target.result;
document.body.appendChild(img);
};
//读取文件
reader.readAsDataURL(blob);
};
document.getElementById('testInput').addEventListener('paste',function(e){
//添加到事件对象中的访问系统剪贴板的接口
varclipboardData=e.clipboardData,
i=0,
items,item,types;
if(clipboardData){
items=clipboardData.items;
if(!items){
return;
}
item=items[0];
//保存在剪贴板中的数据类型
types=clipboardData.types||[];
for(;i<types.length;i++){
if(types[i]==='Files'){
item=items[i];
break;
}
}
//判断是否为图片数据
if(item&&item.kind==='file'&&item.type.match(/^image\//i)){
imgReader(item);
}
}
});
})();
</script>
</body>
</html>
以上就是本文的全部内容，希望对大家学习JavaScript程序设计有所帮助。