这是一个很有意思的地方,很多不了解的人或者初级的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剪贴板操作的更多相关文章

  1. js简单操作Cookie

    贴一段js简单操作Cookie的代码: //获取指定名称的cookie的值 function getCookie(objName) { var arrStr = document.cookie.spl ...

  2. 使用HTML5的JS选择器操作页面中的元素

    文件命名为:querySelector.html,可在Chrome浏览器中预览效果. 1 <!DOCTYPE html> 2 <html lang="en"> ...

  3. node.js高效操作mongodb

    node.js高效操作mongodb Mongoose库简而言之就是在node环境中操作MongoDB数据库的一种便捷的封装,一种对象模型工具,类似ORM,Mongoose将数据库中的数据转换为Jav ...

  4. js字符串操作

    javascript中字符串常用操作总结.JS字符串操作大全 String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度.当然需要注意的是 ...

  5. Node.js之操作文件系统（一）

    Node.js之操作文件系统(一) 1. 同步方法与异步方法 在Node.js中,使用fs模块来实现所有有关文件及目录的创建.写入及删除操作.,在fs模块中,所有对文件及目录的操作都可以使用同步与异步 ...

  6. Node.js之操作文件系统（二）

    Node.js之操作文件系统(二) 1.创建与读取目录 1.1 创建目录 在fs模块中,可以使用mkdir方法创建目录,该方法的使用方法如下: fs.mkdir(path,[mode],callbca ...

  7. js数组操作-添加，删除

    js 数组操作常用方法. push():在数组后面加入元素,并返回数组的长度 unshift():在数组前面加入元素,并返回数组的长度 pop()删除最后一个元素 shift()删除第一个元素 var ...

  8. 页面循环绑定（变量污染问题），js面向对象编程（对象属性增删改查），js字符串操作，js数组操作

    页面循环绑定(变量污染问题) var lis = document.querySelectorAll(".ul li") for ( var i = 0 ; i < lis. ...

  9. js数组操作-最佳图解

    js数组操作-最佳图解

随机推荐

  1. js中break跳出多层循环

    // 当执行多重循环的时候break的情况 outer: for(var i=0;i<10;i++){ inter: for(var j=0;j<10;j++){ if(i>5){ ...

  2. NOIP PJ游记

    Day -1 感觉自信满满,一等奖应该稳了,毕竟初一时我这么菜都拿了二等奖,然后就睡觉了... Day 1 在大巴上玩元气骑士可开心了,车上欢欢喜喜,到了考场,一眼看题,以为很简单. T1硬模拟... ...

  3. Spring的注解@Qualifier

    近期在捯饬spring的注解,现将遇到的问题记录下来,以供遇到同样问题的童鞋解决~ 先说明下场景,代码如下: 有如下接口: public interface EmployeeService { pub ...

  4. P2341 [HAOI2006]受欢迎的牛（tarjan+缩点）

    P2341 [HAOI2006]受欢迎的牛 题目描述 每头奶牛都梦想成为牛棚里的明星.被所有奶牛喜欢的奶牛就是一头明星奶牛.所有奶 牛都是自恋狂,每头奶牛总是喜欢自己的.奶牛之间的“喜欢”是可以传递的 ...

  5. 如何让button保持点击状态

    http://blog.csdn.net/u010957508/article/details/38385207 他的原理就是在代码里面: view.setSelected(true); 而其他的: ...

  6. bootstrap设计横线上加字

    1.给横线上加字 . 2.思路:通过z-index实现,可以将父元素的z-index设置成2,而横线的z-index设置成-1,这样有字的地方就可以覆盖横线,再设置字的padding达到合理的宽度 ( ...

  7. Java代码中获取配置文件(config.properties)中内容的两种方法

    方法千千万,本人暂时只总结了两种方法. (1)config.properties中的内容如图 在applicationContext.xml中配置 <!-- 引入配置文件 --> < ...

  8. 剑指Offer - 九度1388 - 跳台阶

    剑指Offer - 九度1388 - 跳台阶2013-11-24 03:43 题目描述: 一只青蛙一次可以跳上1级台阶,也可以跳上2级.求该青蛙跳上一个n级的台阶总共有多少种跳法. 输入: 输入可能包 ...

  9. 【Invert Binary Tree】cpp

    题目: Invert Binary Tree Total Accepted: 20346 Total Submissions: 57084My Submissions Question Solutio ...

  10. Flask 教程精简版之一（系列片）

    Flask 教程精简版之一(系列片) 现在连教程都有精简版 准备 1.要学会 Flask 之前必须掌握 Python 基本使用. 2.会使用简单的 HTML 效果更加 3.若想练气功必须先自暴自弃 简 ...