这篇文章主要介绍了在网页中实现读取剪贴板粘贴截图功能,即可以把剪贴板的截图Ctrl+V粘贴到网页的一个输入框中,例如QQ截图、旺旺截图或者其它截图软件。具体代码如下。

利用 clipboardData 在网页中实现截屏粘贴的功能

#box{ width:200px; height:200px; border:1px solid #ddd; }

利用 clipboardData 在网页中实现截屏粘贴的功能

(function(){

var imgReader = function( item ){

var blob = item.getAsFile(),

reader = new FileReader();

// 读取文件后将其显示在网页中

reader.onload = function( e ){

var img = new Image();

img.src = e.target.result;

document.body.appendChild( img );

};

// 读取文件

reader.readAsDataURL( blob );

};

document.getElementById( 'testInput' ).addEventListener( 'paste', function( e ){

// 添加到事件对象中的访问系统剪贴板的接口

var clipboardData = 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 );

}

});

})();

html制作qq注册页面代码截图,javascript在网页中实现粘贴qq截图功能相关推荐

javascript在网页中实现粘贴qq截图功能
这篇文章主要介绍了在网页中实现读取剪贴板粘贴截图功能,即可以把剪贴板的截图Ctrl+V粘贴到网页的一个输入框中,例如QQ截图.旺旺截图或者其它截图软件.具体代码如下. <!DOCTYPE HTM ...
HTML5期末大作业：运动系列——NBA篮球主题学生网页设计(7个页面) HTML+CSS+JavaScript 体育网页设计HTML代码学生网页课程设计期末作业下载大学生网页设计制作成
HTML5期末大作业:运动系列--NBA篮球主题学生网页设计(7个页面) HTML+CSS+JavaScript 体育网页设计HTML代码学生网页课程设计期末作业下载大学生网页设计制作成临近期末 ...
实现简单QQ注册页面
HTML实现简单QQ注册页面今天突发奇想,仿一个QQ注册页面哈哈!! 效果如图: 按钮功能都还没实现,只是一个简单的网页界面! 实现代码如下 <!DOCTYPE html> <ht ...
HTML5期末大作业：中国传统节日网页设计——端午节(9个页面) HTML+CSS+JavaScript 节日网页HTML代码学生网页课程设计期末作业下载
HTML5期末大作业:中国传统节日网站设计--端午节(9个页面) HTML+CSS+JavaScript 节日网页HTML代码学生网页课程设计期末作业下载临近期末, 你还在为HTML网页设计结课作 ...
HTML5期末大作业：中国传统节日网页设计——端午节(9个页面) HTML+CSS+JavaScript 节日网页HTML代码学生网页课程设计期末作业下载...
HTML5期末大作业:中国传统节日网站设计--端午节(9个页面) HTML+CSS+JavaScript 节日网页HTML代码学生网页课程设计期末作业下载临近期末, 你还在为HTML网页设计结课作 ...
QQ注册页面（完整版）
前言最近学了一点HTML和CSS的基础知识,于是就做了一个QQ注册页面来检验一下成果. 一.效果展示二. 代码展示 1.HTML部分 <!DOCTYPE html> <html ...
清爽登录界面html,基于css3实现扁平简洁清爽的登录注册页面代码
今天给大家分享一款基于css3实现扁平简洁清爽的登录注册页面代码,使用浅色设计,兼容移动设备,加入了基本的表单验证,适合大部分网站. 代码很简单有css样式,index.html两部分代码.感兴趣的朋 ...
html制作登陆注册页面
html制作登陆注册页面源代码如下 <!DOCTYPE html> <html lang="en"> <head><meta chars ...
web课程设计网页规划与设计：网页设计——在线书店(12个页面) HTML+CSS+JavaScript 学生网页课程设计期末作业...
web课程设计网页规划与设计 :网页设计--在线书店(12个页面) HTML+CSS+JavaScript 学生网页课程设计期末作业临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头 ...

html制作qq注册页面代码截图,javascript在网页中实现粘贴qq截图功能

利用 clipboardData 在网页中实现截屏粘贴的功能

html制作qq注册页面代码截图,javascript在网页中实现粘贴qq截图功能相关推荐

最新文章

热门文章