用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]);});

转载于:https://www.cnblogs.com/zhncnblogs/p/10180142.html

用js实现复制内容到操作系统粘贴板(兼容IE、谷歌、火狐等浏览器)相关推荐

点击复制内容到手机粘贴板（简洁易懂-只需五步）
点击按钮复制内容到手机粘贴板只需简单五步↓ 第一步 npm install clipboard --save 第二步在需要的页面引入(注:路径根据文件-/) 代码如下↓ <script> ...
通过纯js代码实现将指定内容复制到粘贴板(兼容各主流浏览器)
通过纯js代码实现将指定内容复制到粘贴板(兼容各主流浏览器) 1.业务需求: vue项目需要通过点击button按钮将指定内容复制到粘贴板中,且不引入第三方组件. 2.解决方案: js写法如下(这里是 ...
ios下js复制到粘贴板_h5实现一键复制到粘贴板兼容ios
实现原理采用document.execCommand('copy') 来实现复制到粘贴板功能复制必须是选中input框的文字内容,然后执行document.execCommand('copy') ...
html5 复制到剪贴板兼容,JS实现复制内容到剪贴板功能兼容所有浏览器(推荐)
两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...
html 一键复制 ios,h5实现一键复制到粘贴板-兼容ios
实现原理采用document.execCommand('copy')来实现复制到粘贴板功能复制必须是选中input框的文字内容,然后执行document.execCommand('copy')命令 ...
h5 实现一键复制到粘贴板兼容iOS
效果展示先贴上测试连接 http://cdn.foundao.com/zhaosheng/copytext 实现原理采用 document.execCommand('copy') 来实现复制到粘贴 ...
h5实现一键复制到粘贴板兼容iOS
copyText = (text) => {// 数字没有 .length 不能执行selectText 需要转化成字符串const textString = text.toString();l ...
《JS实现复制内容到剪贴板功能，可兼容所有PC浏览器，不兼容手机端》
前记:本来原生的JS是有提供一个函数来实现这个功能(window.clipboardData),但是很遗憾,这个函数仅仅支持IE和FF浏览器,所以基本用处不大.下边介绍的是一个第三方插件库(ZeroC ...
使用clipboard.js实现复制内容至剪贴板
下载插件 clipboard.js是不依赖flash,实现复制内容至剪贴板的js插件.下载clipboard.js的压缩包,根据需要选择dist目录下的压缩或未压缩版. github地址:https: ...

用js实现复制内容到操作系统粘贴板(兼容IE、谷歌、火狐等浏览器)

用js实现复制内容到操作系统粘贴板(兼容IE、谷歌、火狐等浏览器)相关推荐

最新文章

热门文章