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 相关文章推荐
关于Mozilla浏览器不支持innerText的解决办法
Jan 01 Javascript
js,jQuery 排序的实现代码,网页标签排序的实现,标签排序
Apr 27 Javascript
jQuery实用基础超详细介绍
Apr 11 Javascript
JS 两个字符串时间的天数差计算
Aug 25 Javascript
javascript通过className来获取元素的简单示例代码
Jan 10 Javascript
判断window.onload是否多次使用的方法
Sep 21 Javascript
理解javascript中try...catch...finally
Dec 25 Javascript
JavaScript知识点总结(十一)之js中的Object类详解
May 31 Javascript
基于jQuery实现火焰灯效果导航菜单
Jan 04 Javascript
AngularJS 事件发布机制
Aug 28 Javascript
原生js实现随机点名
Jul 05 Javascript
基于javascript实现放大镜特效
Dec 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的几个常用数字判断函数代码
2012/04/24 PHP
php计算数组相同值出现次数的代码(array_count_values)
2015/01/20 PHP
fckeditor上传文件按日期存放及重命名方法
2015/05/22 PHP
PHP Smarty模版简单使用方法
2016/03/30 PHP
详解PHP中websocket的使用方法
2016/09/15 PHP
Zend Framework入门教程之Zend_Config组件用法详解
2016/12/09 PHP
php如何实现不借助IDE快速定位行数或者方法定义的文件和位置
2017/01/17 PHP
利用Homestead快速运行一个Laravel项目的方法详解
2017/11/14 PHP
jquery autocomplete自动完成插件的的使用方法
2010/08/07 Javascript
含有CKEditor的表单如何提交
2014/01/09 Javascript
Eclipse去除js(JavaScript)验证错误
2014/02/11 Javascript
Javscript删除数组中指定元素并返回新数组
2014/03/06 Javascript
使用typeof判断function是否存在于上下文
2014/08/14 Javascript
javascript 获取浏览器版本
2015/01/21 Javascript
利用JS生成博文目录及CSS定制博客
2016/02/10 Javascript
JS与HTML结合使用marquee标签实现无缝滚动效果代码
2016/07/05 Javascript
JS 事件绑定、事件监听、事件委托详细介绍
2016/09/28 Javascript
微信小程序 SocketIO 实例讲解
2016/10/13 Javascript
关于Vue.js一些问题和思考学习笔记(2)
2016/12/02 Javascript
jQuery中clone()函数实现表单中增加和减少输入项
2017/05/13 jQuery
JS 实现banner图片轮播效果(鼠标事件)
2017/08/04 Javascript
vscode配置vue下的es6规范自动格式化详解
2019/03/20 Javascript
详解VUE中的插值( Interpolation)语法
2020/10/18 Javascript
如何处理Python3.4 使用pymssql 乱码问题
2016/01/08 Python
python实现字典(dict)和字符串(string)的相互转换方法
2017/03/01 Python
Python基于回溯法子集树模板解决选排问题示例
2017/09/07 Python
python线程池threadpool实现篇
2018/04/27 Python
python 寻找list中最大元素对应的索引方法
2018/06/28 Python
Scrapy框架爬取Boss直聘网Python职位信息的源码
2019/02/22 Python
python和js交互调用的方法
2020/06/23 Python
Python中pass的作用与使用教程
2020/11/13 Python
CSS3制作炫酷的自定义发光文字
2016/03/28 HTML / CSS
时装界的“朋克之母”:Vivienne Westwood
2017/07/06 全球购物
国庆节演讲稿
2014/05/27 职场文书
结婚老公保证书
2015/02/26 职场文书
nginx proxy_cache 缓存配置详解
2021/03/31 Servers