使用 clipboard 插件结合 layui 实现的一键复制按钮

• 引入剪切板插件js
  下载地址： https://github.com/zenorocha/clipboard.js/archive/master.zip

<script th:src="@{/static/js/clipboard.min.js}"></script>

• 写一段公用JS

<script>
　　var clipboard;
　　$(function(){
　　　　clipboard = new ClipboardJS('.js-clipboard');
　　　　clipboard.on('success', function(e) {
　　　　　　console.log(e)
　　　　　　layer.msg('复制成功');
　　　　});

　　　　clipboard.on('error', function(e) {
　　　　　　console.log(e)
　　　　　　layer.msg('复制失败');
　　　　});

　　});
</script>

• 点击某按钮弹出窗口

//弹出一个提示层
$('#showall').on('click', function(){
　　layer.open({
　　type: 1,
　　area: ['600px', '360px'],
　　shadeClose: true, //点击遮罩关闭
　　content: '<div style="padding:20px;"><p id="selected" style="margin-bottom: 10px;">'+curFundCodes+'</p><button class="js-clipboard layui-btn layui-btn-normal layui-btn-sm" data-clipboard-target="#selected">复制</button></div>'
　　});
});

• 在页面中添加按钮

//复制 #selected 元素的内容
<button id="showall" class="js-clipboard" data-clipboard-target="#selected">复制</button>

或：

//复制任意文本
<button id="showall" class="js-clipboard" data-clipboard-text="任意文本">复制</button> 

转载：https://blog.csdn.net/IndexMan/article/details/111594325