jQuery插件Zclip实现完美兼容 单击将内容复制到剪贴板

在WEB开发中，要让用户在页面上复制一段代码、URL地址等信息，为了避免用户拖动鼠标然后右键进行复制操作时可能出现的错误，我们可以直接在页面上放置一个复制按钮，只需要轻轻点击复制按钮，内容就会被复制，然后用户就可以将其粘贴到想要粘贴的地方。

超文本标记语言

首先，我们需要将jquery库和zclip插件加载到页面中。这两个文件已经打包，请点击下载。

脚本类型=' text/JavaScript ' src=' http : js/jquery . js '/script script类型=' text/JavaScript ' src=' http 3360 js/jquery . zclip . min . js '/script然后我们在页面的正文部分添加以下代码：

Textarea id='mytext '请输入内容。/textarebr/a href=' # ' id=' copy _ input ' class=' copy '复制内容。/页面上有一个输入框textarea。当然，它也可以是其他html元素，然后是一个复制按钮，或者它可以是链接文本的形式。

java描述语言

当您单击“复制内容”时，调用zclip插件并提示复制成功。请查看代码：

$ (function () {$ ('# copy _ input '))。zclip({ path : ' js/zero clipboard . swf '，copy : function(){//copy content return $(' # my text ')。val()；}，afterCopy:函数(){//copy成功$ ('span id=' msg'/')。insertafter ($ ('# copy _ input '))。文本(“复制成功”)；} });});值得注意的是，如果复制的内容来自输入框输入、textarea等。复制对象使用：

copy:函数(){ return $('#mytext ')。val()；}如果复制的内容来自div和p等页面元素，则copy对象使用：copy: $('#mytext ')。text()；这样就完成了将内容复制到剪贴板的功能。参数描述路径：swf调用路径，例如必须是js/ZeroClipboard.swf，下载包中已经存在ZeroClipboard.swf文件。Copy:复制的内容，必须是任意字符串，也可以是回调函数返回的内容。beforeCopy:复制内容前的回调函数，可选afterCopy:复制内容后的回调函数，可选

以上就是本文的全部内容，希望大家喜欢。