用js实现复制内容到操作系统粘贴板(兼容IE、谷歌、火狐等浏览器)
一、如果只考虑IE浏览器,可以直接用原声js实现
if(window.clipboardData){
//清空操作系统粘贴板
window.clipboardData.clearData();
//将需要复制的内容复制到操作系统粘贴板
window.clipboardData.setData("Text", "要复制的内容");
}
二、如果是其他浏览器,上面的办法行不通,其他浏览器出于安全的考虑禁止js访问操作系统粘贴板。
这里需要用到插件,网上流行的插件有两种,一种是ZeroClipboard.js,一种是clipboard.js。
插件下载地址:https://zenorocha.github.io
1.用ZeroClipboard.js插件需要用到以下三个文件:
ZeroClipboard.js
ZeroClipboard.min.js
ZeroClipboard.swf
这个插件需要浏览器的flash控件支持,复制时先把内容复制到flash里面,再利用flash将内容复制到
操作系统。flash控件又被淘汰的可能,有些浏览器上兼容得也不太好,所以这个插件不太好用。
2.用clipboard.js插件需要用到以下一个文件:
clipboard.min.js
执行复制功能的html标签上需要加上一个属性和一个样式,属性data-clipboard-text的值表示要复制的内容,
样式js-copy表示该标签被绑定上点击复制的功能,在点击该标签时触发复制功能。
该插件兼容IE、谷歌、火狐等浏览器。
js示例代码如下:
$("span").each(function(index,element){if(element.innerHTML=="复制")new Clipboard($(element).parent().attr("data-clipboard-text",Ext.fly(html).dom.innerText).addClass("js-copy")[0]);});
用js实现复制内容到操作系统粘贴板(兼容IE、谷歌、火狐等浏览器)的更多相关文章
- js实现复制内容到剪切板,兼容pc和手机端,支持Safari浏览器
Javascript原生有一些事件:copy.paste.cut, 这些事件可以作用的目标元素: 能获得焦点的元素 (如contentEditable内容能编辑或者可以选中的元素),或者是<bo ...
- javascript网页复制功能-复制到粘贴板-兼容多数浏览器(不使用flash)
使用方法:clipBordCopy("hello Copy");//执行后复制hello Copy到粘贴板 通过 var result = clipBordCopy("h ...
- js实现复制内容到粘贴板
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- js实现复制内容
一.实现点击按钮,复制文本框中的的内容 <script type="text/javascript"> function ...
- js复制内容到剪切板,兼容pc和手机端,支持Safari浏览器
最近,一些项目中用到监听用户复制.剪切的操作. 案例1.在PC端,当用户获得一个京东卡的使用券,当用户使用ctrl + C复制得到的使用券时,将使用券的代号复制到粘贴板,以便于用户ctrl+v进行 ...
- 《JS实现复制内容到剪贴板功能,可兼容所有PC浏览器,不兼容手机端》
前记:本来原生的JS是有提供一个函数来实现这个功能(window.clipboardData),但是很遗憾,这个函数仅仅支持IE和FF浏览器,所以基本用处不大.下边介绍的是一个第三方插件库(ZeroC ...
- 使用clipboard.js实现复制内容至剪贴板
下载插件 clipboard.js是不依赖flash,实现复制内容至剪贴板的js插件.下载clipboard.js的压缩包,根据需要选择dist目录下的压缩或未压缩版. github地址:https: ...
- 纯js实现复制内容到剪切板
下面的方法可以完美实现: 复制指定input 或者 textarea中的内容: 指定非输入框元素中的内容 代码如下: function copyToClipboard(elem) { // creat ...
- tmux复制到windows剪贴板/粘贴板的坑
以下所有操作都是在windows下面用putty连接linux centos6的情景下. 一直很纳闷为什么在tmux模式下不能把复制到的文字放到系统的粘贴板里面呢?通过层层阻碍,终于找到了原因. 去掉 ...
随机推荐
- SpringCloud Netflix Ribbon
Eureka客户端的负载均衡:从Eureka server拿到节点列表,客户端自己使用负载均衡的算法确定要使用的节点: Eureka服务端的负载均衡:服务端使用负载均衡的算法,从节点列表中确定要使用的 ...
- 微信小程序 - height: calc(xx - xx);无效
遇到一个小问题,记录一下 问题:在微信小程序中使用scroll-view标签时,用height:cale(xx - xx)设置高度无效,在page中设置高度为百分百依旧无效 解决办法:直接在父级vie ...
- 吴裕雄 python 机器学习——支持向量机SVM非线性分类SVC模型
import numpy as np import matplotlib.pyplot as plt from sklearn import datasets, linear_model,svm fr ...
- MySQL必知必会(第4版)整理笔记
参考书籍: BookName:<SQL必知必会(第4版)> BookName:<Mysql必知必会(第4版)> Author: Ben Forta 说明:本书学习笔记 1.了解 ...
- Go并发介绍
1. 进程.线程.协程 进程(Process),线程(Thread),协程(Coroutine,也叫轻量级线程) 进程 进程是一个程序在一个数据集中的一次动态执行过程,可以简单理解为“正在执行的程序” ...
- iOS 组件化开发之使用CocoaPod制作自己的远程私有库
随着应用需求逐步迭代,应用的代码体积将会越来越大,为了更好的管理应用工程,我们开始借助CocoaPods版本管理工具对原有应用工程进行拆分.但是仅仅完成代码拆分还不足以解决业务之间的代码耦合,为了更好 ...
- app内区域截图利用html2Canvals保存到手机 截屏 (html2Canvals2版本1.0.0)
html2canvas($(], {scale:,logging:false,useCORS:true}).then(function(canvas) { var dataUrl = canvas.t ...
- python练习:编写一个程序,要求用户输入10个整数,然后输出其中最大的奇数,如果用户没有输入奇数,则输出一个消息进行说明。
python练习:编写一个程序,要求用户输入10个整数,然后输出其中最大的奇数,如果用户没有输入奇数,则输出一个消息进行说明. 重难点:通过input函数输入的行消息为字符串格式,必须转换为整型,否则 ...
- 占位符 css
== 普通的英文半角空格 == == == no-break space (普通的英文半角空格但不换行) == 中文全角空格 (一个中文宽度) == == en空格 (半个中文 ...
- C#面向对象三大特性:多态
什么是多态 公司最近为了陶冶情操,养了几种动物(Animal),有猫(Cat).狗(Dog).羊(Sheep),这些动物都有共同的特性,会吃(Eat).会叫(Shout),但是它们吃的不同,叫的也不同 ...