使用jqurey实现点击button按钮复制div里的文本到剪切板，并使用layui的弹窗提示复制成功的完整代码

最新推荐文章于 2024-03-26 17:26:55 发布

小羊网页模板

最新推荐文章于 2024-03-26 17:26:55 发布

阅读量230

点赞数 3

文章标签： layui 前端 javascript

本文链接：https://blog.csdn.net/m0_58717408/article/details/135959589

版权

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Copy to Clipboard</title>
  <link rel="stylesheet" href="https://cdn.staticfile.org/layui/2.5.6/css/layui.css">
  <script src="https://cdn.staticfile.org/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/layui/2.5.6/layui.js"></script>
</head>
<body>
  <div id="textToCopy" style="display: none;">要复制的文本内容</div>
  <button id="copyButton">复制文本</button>

  <script>
    $(document).ready(function(){
      $('#copyButton').click(function(){
        var text = $('#textToCopy').text();
        var $temp = $("<input>");
        $("body").append($temp);
        $temp.val(text).select();
        document.execCommand("copy");
        $temp.remove();

        layui.use('layer', function(){
          var layer = layui.layer;
          layer.msg('复制成功', {icon: 1});
        });
      });
    });
  </script>
</body>
</html>

小羊网页模板

关注

3
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
使用jqurey实现点击button按钮复制div里的文本到剪切板，并使用layui的弹窗提示复制成功的完整代码

【代码】使用jqurey实现点击button按钮复制div里的文本到剪切板，并使用layui的弹窗提示复制成功的完整代码。
复制链接

扫一扫