JS 巧妙获取剪贴板数据 Excel数据的粘贴


Posted in Javascript onJuly 09, 2009

另外的方法就是用flash了,它可以避开浏览器的安全限制,但是system类中只有set的方法,另外的clipboard类中倒是能访问到,但是似乎需要flash10的版本支持。

网上找了一圈,没啥发现。终于想到去看看google sheet是怎么干的。
发现google sheet实现了excel的纯文本的多数据格粘贴,没有安全限制的需要,没有使用flash。可能很多人都知道这种方法了,反正我一开始很惊讶的,但是无奈,google的js文件是处理过的,看起来太累了。然后又去找ZOHO sheet,它的js文件只简单处理了一下,能debug,能看。
原来,其在body上注册了onkeydown事件,当用户按下ctrl+v键的时候,js将焦点转移到一个textarea标签上,这样,接下来的keyPress和keyUp事件就发生在textarea上了,自然而然的就相当于用户在textarea中复制了一下,然后,js再将焦点转移,从textarea中将值取到。这样就取到了剪贴板内文本数据了。
下面是一个模仿ZOHO sheet实现的小例子。

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>无标题文档</title> 
<script type="text/javascript"><!-- 
    function cellkeydown(event) { 
        if (event.ctrlKey && event.keyCode == 86) { 
            var ss = document.getElementById("textArea"); 
            ss.focus(); 
            ss.select(); 
            // 等50毫秒,keyPress事件发生了再去处理数据 
            setTimeout("dealwithData()",50); 
        }     
    } 
    function dealwithData(event) { 
            var ss = document.getElementById("textArea"); 
            alert(ss.value); 
            ss.blur(); 
    } 
// --></script> 
</head> 
<body onkeydown="return cellkeydown(event)"> 
<div> 
    <textarea id="textArea">

获得的Excel的文本数据,按照\t,\n就可以分割得到格子和行信息了。但这样只能得到简单的纯文本的excel值,格子的样式都弄不到。但我发现一个方法,当向iframe的document中复制的时候(就是在线编辑器的实现方式),这样能出现一些样式信息,IE中特别全,估计是因为自己家的产品自己能解析的缘故,FF和Chrome就只能得到行号列宽等一些简单的属性。不知道谁有方法能得到比较全的信息。
Javascript 相关文章推荐
javascript学习笔记(一) 在html中使用javascript
Jun 18 Javascript
JS图片根据鼠标滚动延时加载的实例代码
Jul 13 Javascript
JavaScript加强之自定义event事件
Sep 21 Javascript
node.js中的emitter.on方法使用说明
Dec 10 Javascript
JavaScript阻止事件冒泡示例分享
Dec 28 Javascript
jquery实现图片水平滚动效果代码分享
Aug 26 Javascript
JS组件Bootstrap导航条使用方法详解
Apr 29 Javascript
javascript实现平滑无缝滚动
Aug 09 Javascript
需灵活掌握的Bootstrap预定义排版类 你精通吗?
Jun 20 Javascript
微信小程序 五星评分(包括半颗星评分)实例代码
Dec 14 Javascript
vue的事件绑定与方法详解
Aug 16 Javascript
mui js控制开关状态、修改switch开关的值方法
Sep 03 Javascript
JavaScript 继承的实现
Jul 09 #Javascript
jquery text,radio,checkbox,select操作实现代码
Jul 09 #Javascript
javascript 字符 Escape,encodeURI,encodeURIComponent
Jul 09 #Javascript
jQuery 1.3 和 Validation 验证插件1.5.1
Jul 09 #Javascript
javascript xml为数据源的下拉框控件
Jul 07 #Javascript
JS 自动完成 AutoComplete(Ajax 查询)
Jul 07 #Javascript
javascript 选择文件夹对话框(web)
Jul 07 #Javascript
You might like
PHP实现根据设备类型自动跳转相应页面的方法
2014/07/24 PHP
CI框架中通过hook的方式实现简单的权限控制
2015/01/07 PHP
php中namespace及use用法分析
2016/12/06 PHP
ThinkPHP实现图片上传操作的方法详解
2017/05/08 PHP
Laravel重定向,a链接跳转,控制器跳转示例
2019/10/22 PHP
js 自定义的联动下拉框
2010/02/07 Javascript
JavaScript建立一个语法高亮输入框实现思路
2013/02/26 Javascript
javascript中普通函数的使用介绍
2013/12/19 Javascript
jQuery通过控制节点实现仅在前台通过get方法完成参数传递
2015/02/02 Javascript
javascript中callee与caller的区别分析
2015/04/20 Javascript
基于Jquery实现表单验证
2020/07/20 Javascript
返回函数的JavaScript函数
2016/06/14 Javascript
PHP捕捉异常中断的方法
2016/10/24 Javascript
Windows系统下安装Node.js的步骤图文详解
2016/11/15 Javascript
jQuery基于事件控制实现点击显示内容下拉效果
2017/03/07 Javascript
Node.js中的http请求客户端示例(request client)
2017/05/04 Javascript
jQueryeasyui 中如何使用datetimebox 取两个日期间相隔的天数
2017/06/13 jQuery
解读vue生成的文件目录结构及说明
2017/11/27 Javascript
如何将你的AngularJS1.x应用迁移至React的方法
2018/02/01 Javascript
JS实现导出Excel的五种方法详解【附源码下载】
2018/03/15 Javascript
JS数组Reduce方法功能与用法实例详解
2020/04/29 Javascript
[01:13:01]2018DOTA2亚洲邀请赛 4.4 淘汰赛 TNC vs VG 第三场
2018/04/05 DOTA
python3.0 字典key排序
2008/12/24 Python
Python实现将目录中TXT合并成一个大TXT文件的方法
2015/07/15 Python
python3.5基于TCP实现文件传输
2020/03/20 Python
Python 给定的经纬度标注在地图上的实现方法
2019/07/05 Python
PyQt5基本控件使用之消息弹出、用户输入、文件对话框的使用方法
2019/08/06 Python
Python字典fromkeys()方法使用代码实例
2020/07/20 Python
python的数学算法函数及公式用法
2020/11/18 Python
python excel和yaml文件的读取封装
2021/01/12 Python
越南电子产品购物网站:FPT Shop
2017/12/02 全球购物
雷曼兄弟的五金店:Lehman’s Hardware Store
2019/04/10 全球购物
酒店管理毕业生自荐信
2013/10/24 职场文书
小学六一儿童节活动方案
2014/08/27 职场文书
英文升职感谢信
2015/01/23 职场文书
干部外出学习心得体会
2016/01/18 职场文书