欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

H5和PC实现点击复制当前文字的功能,兼容ios,安卓

程序员文章站 2022-06-30 17:55:10
<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>document</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
</head>

<body>
    <button type="button" class="btn btn_copy_text" data-clipboard-text="要复制的内容111111">1111111111111111</button>
    <button type="button" class="btn btn_copy_text" data-clipboard-text="要复制的内容222">2222222222222222</button>
    <button type="button" class="btn btn_copy_text" data-clipboard-text="要复制的内容333">33333333333333</button>
    <script>
        // 重要提示1 clipboard  改成clipboardjs 不然会提示错误的 绑定button上,避免ios的不兼容性问题
        console.log(clipboardjs)
            //复制文本
            var clip = new clipboardjs('.btn_copy_text');
            clip.on('success', function (e) {
                e.trigger.interhtml = "复制成功";
            });
       
    </script>

</body>

</html>