【javascript】复制到剪贴板功能（支持目前各种浏览器）

最新推荐文章于 2024-08-10 16:15:00 发布

weixin_30929011

最新推荐文章于 2024-08-10 16:15:00 发布

阅读量72

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/haha12/p/5395796.html

版权

本demo支持各种浏览器复制，亲测可用（IE8，IE9，IE10，火狐，谷歌）。

本demo中使用了ZeroClipboard（下载地址：https://github.com/zeroclipboard/zeroclipboard）。

本demo 必须在服务器环境下，浏览器直接打开无效。

本demo 需要引入3个文件：jquery.min.js、ZeroClipboard.min.js和ZeroClipboard.swf。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>复制到剪切板demo</title>
<script type="text/javascript" src="/webtest/js/jquery.min.js"></script>
<script type="text/javascript" src="/webtest/js/ZeroClipboard.min.js"></script>
</head>
<body>
    <input type="button" value="复制当前页面url" class="my_copy" >
</body>
<script type="text/javascript">

$(function() {
    var url = window.location.href;
    
    try{//支持ZeroClipboard
        ZeroClipboard.config( { swfPath:  "/webtest/js/ZeroClipboard.swf" } );
        $(".my_copy").each(function(i) {
            var client = new ZeroClipboard($(this));
            client.on("copy", function (event) {
                  var clipboard = event.clipboardData;
                  clipboard.setData( "text/plain", url);
                  alert('当前页面链接已复制到剪贴板！');
                  // clipboard.setData( "text/html", "<b>Copy me!</b>" );
                  // clipboard.setData( "application/rtf", "{\\rtf1\\ansi\n{\\b Copy me!}}" );
                });
        });
    }catch(e){
        //不支持ZeroClipboard
        $(".my_copy").each(function(i) {
            $(this).on("click", function(){
                var res = window.clipboardData.setData("Text", encodeURI(url));
                if(res){
                    alert('收集链接已复制到剪贴板！');
                }
                
            });
            
        });
    }
    

})
</script>
</html>

转载于:https://www.cnblogs.com/haha12/p/5395796.html

weixin_30929011

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【javascript】复制到剪贴板功能（支持目前各种浏览器）

本demo支持各种浏览器复制，亲测可用（IE8，IE9，IE10，火狐，谷歌）。本demo中使用了ZeroClipboard（下载地址：https://github.com/zeroclipboard/zeroclipboard）。本demo 必须在服务器环境下，浏览器直接打开无效。本demo 需要引入3个文件：jquery.min.js、ZeroClipboard.min....
复制链接

扫一扫