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 相关文章推荐
jQuery初学:find()方法及children方法的区别分析
Jan 31 Javascript
javascript教程之不完整的继承(js原型链)
Jan 13 Javascript
jquery自动填充勾选框即把勾选框打上true
Mar 24 Javascript
jquery使用slideDown实现模块缓慢拉出效果的方法
Mar 27 Javascript
JQuery遍历DOM节点的方法
Jun 11 Javascript
JavaScript 实现的checkbox经典实例分享
Oct 16 Javascript
深入理解 JavaScript 中的 JSON
Apr 06 Javascript
JS脚本实现网页自动秒杀点击
Jan 11 Javascript
深入浅析var,let,const的异同点
Aug 07 Javascript
Vue.js中 v-model 指令的修饰符详解
Dec 03 Javascript
Vue2.0+Vux搭建一个完整的移动webApp项目的示例
Mar 19 Javascript
JS中this的4种绑定规则详解
Feb 04 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
无法载入 mcrypt 扩展,请检查 PHP 配置终极解决方案
2011/07/18 PHP
ThinkPHP分页类使用详解
2014/03/05 PHP
PHP里8个鲜为人知的安全函数分析
2014/12/09 PHP
php中 $$str 中 &quot;$$&quot; 的详解
2015/07/06 PHP
一段实时更新的时间代码
2006/07/07 Javascript
jquery offset函数应用实例
2012/11/14 Javascript
浅析LigerUi开发中谨慎载入common.css文件
2013/07/09 Javascript
JS获取当前日期和时间的简单实例
2013/11/19 Javascript
jQuery实现预加载图片的方法
2015/03/17 Javascript
jQuery UI设置固定日期选择特效代码分享
2015/08/27 Javascript
第一次接触JS require.js模块化工具
2016/04/17 Javascript
jQuery插件扩展extend的简单实现原理
2016/06/24 Javascript
jQGrid Table操作列中点击【操作】按钮弹出按钮层的实现代码
2016/12/05 Javascript
jQuery展示表格点击变色、全选、删除
2017/01/05 Javascript
走进AngularJs之过滤器(filter)详解
2017/02/17 Javascript
基于require.js的使用(实例讲解)
2017/09/07 Javascript
React Native自定义控件底部抽屉菜单的示例
2018/02/08 Javascript
跟老齐学Python之有点简约的元组
2014/09/24 Python
python中利用await关键字如何等待Future对象完成详解
2017/09/07 Python
利用Python yagmail三行代码实现发送邮件
2018/05/11 Python
python把数组中的数字每行打印3个并保存在文档中的方法
2018/07/17 Python
Django 过滤器汇总及自定义过滤器使用详解
2019/07/19 Python
PyCharm汉化安装及永久激活详细教程(靠谱)
2020/01/16 Python
最小二乘法及其python实现详解
2020/02/24 Python
python实现小程序推送页面收录脚本
2020/04/20 Python
python如何输出反斜杠
2020/06/18 Python
python实现人性化显示金额数字实例详解
2020/09/25 Python
OSPREY LONDON官网:英国本土皮具品牌
2019/05/31 全球购物
餐饮商业计划书范文
2014/04/29 职场文书
机械工程学院大学生求职信
2014/05/25 职场文书
小学一年级数学教学计划
2015/01/20 职场文书
门卫岗位职责
2015/02/09 职场文书
2015重阳节座谈会主持词
2015/07/30 职场文书
运动会班级口号霸气押韵
2015/12/24 职场文书
导游词之云南丽江古城
2019/09/17 职场文书
用Python仅20行代码编写一个简单的端口扫描器
2022/04/08 Python