JQuery实现复制到剪贴板功能
在网页中实现复制到剪贴板功能,有两种方法, 第1种方法:使用JavaScript自带的方法,但是这种方法只能在IE下使用。 document.execCommand("Copy"); // 执行浏览器复制命令 alert("已复制好,可贴粘。"); 或者 window.clipboardData.setData("Text","要复制的内容"); alert("已复制好,可贴粘。"); 第2种方法:使用Jquery.ZeroClipboard组件,这种方法通过内嵌flash来实现的,可以兼容当前流行的各种浏览器。 我们今天主要讲解第2种方法的实现(该方法在本地测试好像不行,必须发布到服务器上才可以) 首先引用JQuery和Jquery.ZeroClipboard,其中包括一个swf文件。 下面是网页的源代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>JQuery实现复制到剪贴板功能</title> <script type="text/javascript" src="JavaScript/jquery-1.10.2.min.js"></script> <script type="text/javascript" src="JavaScript/ZeroClipboard.js"></script> <script type="text/javascript"> $(function () { //实现复制功能 $("#Copy").zclip({ path: 'JavaScript/ZeroClipboard.swf', copy: $("#txtInput").val() + "\r\n" + "[转载自:IT交流吧(http://www.itc8.com)]", afterCopy: function () { alert("复制成功,您可以粘贴发送给QQ上的好友或QQ群了!"); } }); }); </script> </head> <body> <input type="text" id="txtInput" /> <input type="button" id="Copy" value="复制" /> </body> </html>