clipboard.js的简单使用

HTML部分:

<!--从属性复制-->
<a class="a_promition copyBtn" data-clipboard-text="{$my_url}{$vo['register_url']}" href="javascript:;">
                              复制链接
                          </a>

<!--从另一个元素复制文本-->
<!-- Target -->
<input id="foo" value="https://github.com/zenorocha/clipboard.js.git">

<!-- Trigger -->
<button class="copyBtn" data-clipboard-target="#foo">
    <img src="assets/clippy.svg" alt="Copy to clipboard">
</button>

<!--从另一个元素剪切文本-->
<!--剪切（cut）动作只在 <input> 或 <textarea> 元素起作用。-->
<!-- Target -->
<textarea id="bar">Mussum ipsum cacilds...</textarea>

<!-- Trigger -->
<button class="copyBtn" data-clipboard-action="cut" data-clipboard-target="#bar">
    Cut to clipboard
</button>

JS部分:

//注意版本号
    <script src="https://cdn.bootcss.com/clipboard.js/2.0.4/clipboard.min.js"></script>

<script>
let clipboard = new ClipboardJS('.copyBtn');

    clipboard.on('success', function(e) {
        layer.msg('复制成功');
        e.clearSelection();// 清除选中内容
    });

    clipboard.on('error', function(e) {
        layer.alert('复制失败!');
        console.error('Action:', e.action);
        console.error('Trigger:', e.trigger);
    });
</script>