js剪贴板操作
这是一个很有意思的地方,很多不了解的人或者初级的js编程者会觉得很不可思议,js都那么强大了,访问剪贴板一个粘贴复制,大概就是一行命令的事情,但是事实如此,js对于访问本地计算机的剪贴板的支持其实是十分滞后的,看起来似乎是一个很小很小的一个功能,其实即使是html5标准里对于剪贴板操作目前也仍处于草案提议阶段,各浏览器有自己各自的部分实现方案,有的甚至根本就没有需要的实现接口,而且事实上,访问剪贴板的接口标准制定并不是那么容易的一件事情,需要考虑的事情有很多方面,具体哪些地方感兴趣的可以参考这里
需要标准还在建立中,但是事实上,遇到类似的需求我们并不是不能实现,所以这里总结一下大致几种实现方案:
1.window.clipboardData对象 (有兼容性问题,火狐上不行,支持ie,其它浏览器未知)
当复制的时候body的oncopy事件被触发,直接return false就是禁止复制,注意是不能复制网页里的文本了
<body oncopy="alert('禁止复制!');return false;">
clipboardData对象 ,注意网页里剪贴板到现在只能设置Text类型,即只能复制文本
clearData("Text") 清空粘贴板 clearData(sDataFormat) 删除剪贴板中指定格式的数据。
getData("Text") 读取粘贴板的值 getData(sDataFormat) 从剪贴板获取指定格式的数据。
setData("Text",val) 设置粘贴板的值 setData(sDataFormat, sData) 给剪贴板赋予指定格式的数据。返回 true 表示操作成功。
复制的数据加入相关来源
clipboardData.setData('Text',clipboardData.getData('Text') +
'\r\n来自Pigeon网站' + location.href);
调用时注意不能再body 的oncopy事件上直接用 <body oncopy="setTimeout('ModifyCopyData()',100)">
2.例子:
<input type="text" onclick="oCopy(this)" value="你好.要copy的内容!">
<script>
function oCopy(obj){
obj.select(); // 选中输入框中的内容
js=obj.createTextRange();
js.execCommand("Copy") ;
}
</script>
注意: creatTextRange() 方法是 ms-only的方法 非微软家的不可用,会报错.
execCommand 方法通常用于控制可编辑的 IFRAME 内容,制作富文本编辑器。 但他现在为止还是非标准的,方法的首参数 Commmands 的可选值由各个浏览器厂商制定,支持程度并不统一。
详细说明:http://www.w3help.org/zh-cn/causes/BX9054
测试各浏览支持情况: http://www.w3help.org/tests/BX9054/execCommand_sCommands_Parameters.html
使用例子: http://blog.csdn.net/woshinia/article/details/18664903
打印,另存为等都是通过这个命令
3.好的方案:
Clipboard.js:不用Flash实现剪贴板功能的轻量级JavaScript库,
主流浏览器都支持这个库,Safari目前仍不支持cut和copy指令,它使用execCommand实现
使用adobe flash 的方式 zeroclipboard http://zeroclipboard.org/ Github用JavaScript库ZeroClipboard来实现这一功能
或者用 jquery.zclip.js jquery封装后的 使用例子: http://www.cnblogs.com/linjiqin/p/3532451.html
html5的剪贴板提议仍在进行中 https://w3c.github.io/clipboard-apis/
具体可用情况可以使用这里can i use it? http://caniuse.com/#search=clipboard
js剪贴板操作的更多相关文章
- js简单操作Cookie
贴一段js简单操作Cookie的代码: //获取指定名称的cookie的值 function getCookie(objName) { var arrStr = document.cookie.spl ...
- 使用HTML5的JS选择器操作页面中的元素
文件命名为:querySelector.html,可在Chrome浏览器中预览效果. 1 <!DOCTYPE html> 2 <html lang="en"> ...
- node.js高效操作mongodb
node.js高效操作mongodb Mongoose库简而言之就是在node环境中操作MongoDB数据库的一种便捷的封装,一种对象模型工具,类似ORM,Mongoose将数据库中的数据转换为Jav ...
- js字符串操作
javascript中字符串常用操作总结.JS字符串操作大全 String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度.当然需要注意的是 ...
- Node.js之操作文件系统(一)
Node.js之操作文件系统(一) 1. 同步方法与异步方法 在Node.js中,使用fs模块来实现所有有关文件及目录的创建.写入及删除操作.,在fs模块中,所有对文件及目录的操作都可以使用同步与异步 ...
- Node.js之操作文件系统(二)
Node.js之操作文件系统(二) 1.创建与读取目录 1.1 创建目录 在fs模块中,可以使用mkdir方法创建目录,该方法的使用方法如下: fs.mkdir(path,[mode],callbca ...
- js数组操作-添加,删除
js 数组操作常用方法. push():在数组后面加入元素,并返回数组的长度 unshift():在数组前面加入元素,并返回数组的长度 pop()删除最后一个元素 shift()删除第一个元素 var ...
- 页面循环绑定(变量污染问题),js面向对象编程(对象属性增删改查),js字符串操作,js数组操作
页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...
- js数组操作-最佳图解
js数组操作-最佳图解
随机推荐
- c#字符显示转换{0:d} string.Format()
这一篇实际和前几个月写的没什么本质上的区别.但是这篇更明确一点,学起来easy c#字符显示转换{0:d} C#:String.Format数字格式化输出 : int a = 12345678; // ...
- html之table&select不为人知的操作
table标签和其它标签不一样,他有属性和方法! table属性: rows 可以得到table的row集合 cells 得到table所有单元格 table方法: insertR ...
- Python面向对象--高级(二)
## 使用__slots__限制类的属性 - 之前说到,可以通过在类外部实例或者类名任意定义实例属性或者类属性或者方法 class Person(object): pass Person.name = ...
- HTML+CSS : 笔记整理(1)
meta:页面描述信息(可以在里面加入作者信息等,如: <meta name="description"content="HTML examples"&g ...
- PHP开发环境搭建一:PHP集成环境XAMPP 的安装与配置
1. XMAPP简介 XAMPP(Apache+MySQL/MariaDB+PHP+Perl)开头的X代表X-OS,代表可以在任何常见操作系统下使用,包括Windows.Mac.Linux,开源平台. ...
- .c和.h区别
本质没有区别: .h是头文件 一般情况下下边内容放在.h文件中 宏定义 结构体,联合,枚举声明 typedef声明 外部函数声明 全局变量声明 .c是程序文件 一般情况下下边内容放在.h文件中 内含函 ...
- Qt的QWebChannel和JS、HTML通信/交互驱动百度地图
Qt的QWebChannel和JS.HTML通信/交互驱动百度地图 0 前言 我一个研究嵌入式的,不知道怎么就迷上了上位机,接了几个项目都是关于Qt,这个项目还是比较经典的,自己没事儿的时候也进行研究 ...
- 重头开始学Qt——day1
以前学过Qt,但只是为了学分,现在重学. 1. 认识Qt应用程序框架 直接新建一个项目后,自动生成了一下文件,下面一个个理解. (1)main.cpp main.cpp中特别的是QApplicatio ...
- POJ:1258-Agri-Net
Agri-Net Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 65322 Accepted: 27029 Descriptio ...
- 笔记-git-git服务器安装及配置
笔记-git-git服务器安装及配置 1. GIT服务器简介 Git 可以使用四种主要的协议来传输数据:本地传输,SSH 协议,Git 协议和 HTTP 协议.下面分别介绍一下哪些情形应该使 ...