一键复制到剪切板功能(支持web和微信)

前言：最近在做微信返利服务号，直接返回淘口令文本消息怕被封。于是打算改成图文消息的形式，那么问题就来了，怎么让用户更简单的进行淘口令复制呢？

Clipboard.js

使用方法,几行代码搞定

data-clipboard-target 指定要复制的标签 data-clipboard-action 指定事件copy 或 cut

<p id="tkl" th:text="'长按复制本条信息（'+${tkl}+'）打开手淘下单即可!'" style="text-align: center; "></p>
<button id="btn" data-clipboard-target="#tkl" data-clipboard-action="copy"
        class="btn btn-success" style="text-align: center;width: 100%">
    一键复制
</button>

$(document).ready(function () {
   let clipboard = new ClipboardJS('.btn');
   clipboard.on('success', function (e) {
       console.log(e);
       document.getElementById('btn').innerHTML = '复制成功';
   });
});
复制代码

遇到的问题

一开始从网上看到的教程结果出现这个问题。ReferenceError: Clipboard is not defined

原因：一开始的写法let clipboard = new Clipboard('.btn');

最后推荐一下我的公众号，淘宝购物返现用