宝哥软件园

JS实现了将内容复制到剪贴板的功能

编辑:宝哥软件园 来源:互联网 时间:2021-09-06

前言:原本原生JS提供了一个函数来实现这个功能(window.clipboardData),但遗憾的是这个函数只支持IE和FF浏览器,基本没什么用。下面是一个第三方插件库(ZeroClipboard.js)。

Git上零剪贴板. js的地址是:https://github.com/zeroclipboard/zeroclipboard

注意:这个js库不支持兼容手机(包括安卓和IOS),只支持PC浏览器。

步骤1:将插件库引入到项目中。

将Git上的dist目录复制到自己的目录中(其实只需要ZeroClipboard.js和ZeroClipboard.swf就可以了~)

脚本文件简介:

脚本src=' http : zero clipboard . js '/脚本

步骤2:初始化插件库。

var clip=new zero clipboard(document . getelementbyid(' d _ clip _ button '),{ moviepath : ' zero clipboard . swf ' });第三步:编码。

!DOCTYPE htmlhtmlheadtitleZero剪贴板Test/title meta charset=' utf-8 '/head body!-描述:1 .数据-剪贴板-目标输入要复制的对象的id-button id=' d _ clip _ button ' class=' my _ clip _ button '数据-剪贴板-目标=' Fe _ text '复制到剪贴板/button br/Textarea id=' Fe _ text ' cols=' 50 ' row=' 3 '输入要复制的内容/Textarea/body/html Script type=' text/JavaScript ' src=' http 3360 zero clipboard . js '/Script Script type=' text '//operation clip.on ('complete ',function (client,args) {alert('复制成功,复制内容为:' args . text ');} );/script零剪贴板的功能已经在上面的示例代码注释中介绍过了。更多功能,请前往https://github.com/zeroclipboard/ZeroClipboard.

注意:运行环境必须在服务器环境,否则看不到效果!

以上就是本文的全部内容。希望本文的内容能给大家的学习或工作带来一些帮助,也希望多多支持我们!

更多资讯
游戏推荐
更多+