jQuery插件复制文本到剪切板

最新推荐文章于 2024-05-17 09:00:00 发布

chris_zqw

最新推荐文章于 2024-05-17 09:00:00 发布

阅读量586

点赞数

分类专栏： jQuery

本文链接：https://blog.youkuaiyun.com/chris_zqw/article/details/81289793

版权

jQuery 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一种使用jQuery和Clipboard.js库实现网页中一键复制文本到剪贴板的功能。通过简单的JavaScript代码，可以为按钮添加复制功能，并通过layer.js库反馈复制结果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >


<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>jQuery/Js复制文本到剪贴板</title>
  <script src="http://apps.bdimg.com/libs/jquery/1.8.3/jquery.js"></script> 
  <script type="text/javascript" src="http://www.jq22.com/demo/copy20161120/dist/clipboard.min.js"></script>
 </head>
 <body>
  <div id="demo">http://www.baidu.com</div>
  <button class="btn3">复制</button>

<script>
    $(document).ready(function() {
        var a = $('#demo').text();
            var clipboard2 = new ClipboardJS('.btn3',{
                text:function () {
                    return a;
                }
            });
            clipboard2.on('success', function (e) {
                layer.msg("复制成功！");
            });
            clipboard2.on('error', function (e) {
                layer.msg("复制失败！请手动复制")
            });
       

    });
    
   
 
</script>
  </body>
</html>