可以实现一键复制需要的字段。
HTML页面：
<meta name=\"viewport\" content=\"width=device-width, initial-scale=1
本文是《帝国cms（共312篇）》专题的第 165 篇。阅读本文前，建议先阅读前面的文章：
可以实现一键复制需要的字段。
HTML页面：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script src="js/clipboard.js"></script>
<style>
.tips,.tipsbg{display: none;}
.tipsbg{width: 100%;height: 100%;position: fixed;background: rgba(0, 0, 0, 0.3); top: 0px; left: 0px; right: 0px; bottom: 0px;z-index: 2;}
.tips{width: 160px;height: 200px;position: fixed;background: rgba(0, 0, 0, 0.5); top: 0px; left: 0px; right: 0px; bottom: 0px;z-index: 3;margin: 200px auto 0 auto;border-radius: 10px;}
.tips img{width: 80px;margin: 30px auto;display: block;}
.tipssuc{width: 100%;height: 40px;line-height: 40px;text-align: center;color: #fff;font-size: 16px;}
.sidebar{width:30px;position:fixed;top:300px;left:50%;margin-left:-555px;z-index:9}
.sidebar a {width: 42px;padding: 13px 0;color: #666;background: #fff;-webkit-box-shadow:0px 2px 15px 0px rgba(0,0,0,0.1);box-shadow: 0px 2px 15px 0px rgba(0,0,0,0.1);border-radius: 21px;text-align: center;transition: all .2s cubic-bezier(.215,.61,.355,1);position: relative;cursor: pointer;margin-bottom:15px;display: block;text-decoration:none;}
.sidebar span {font-size: 13px;display: block;padding: 0 12px;line-height: 17px;}
.sidebar a:hover{background-color:#478ede; text-decoration:none;color:#fff;-webkit-box-shadow:0px 0px 10px 0px rgba(0,0,0,0.3);box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);}
</style>
</head>
<body>
<div id="docopy" class="content">
alskdjf
</div>
<div class="tipsbg" onclick="$('.tips').hide();$('.tipsbg').hide();"></div>
<div id="success" class="tips" onclick="$('.tips').hide();$('.tipsbg').hide();">
<img src="images/cg.png" alt="">
<div class="tipssuc">复制成功</div>
</div>
<div class="sidebar">
<a id="copytext" data-clipboard-action="copy" data-clipboard-target="#docopy" class="fuzhi"><span>一键复制</span></a>
</div>
<script>
$(document).ready(function () {
var clipboard = new ClipboardJS('#copytext');
clipboard.on('success', function (e) {
$('#success').show();
$('.tipsbg').show();
});
});
</script>
</body>
</html>
JS+html打包下载地址：
1649611865-12cba3ee81cf4a7.rar
效果演示：http://dhg1.cncobo.com/dhg100z/5216.html
您已阅读完《帝国cms（共312篇）》专题的第 165 篇。请继续阅读该专题下面的文章：
购买必读
本站模板没有任何后门，也不会和我们服务器有任何通信，请您放心使用。
本源码一次性买断，没有二次费用，并享受免费更新。
在使用本站模板时，请不要使用我们的产品从事违反中华人民共和国法律、违反公序良俗的活动，否则我们有权拒绝服务，并配合有关单位予以处置。如果您不符合条件，请勿购买。
售后是指通过QQ与客服联系处理问题，售后过期不影响您对主题的使用和更新。免费三个月售后服务。售后服务时间为工作日早9点到晚5点。如果不在线可以QQ留言，我们会尽快给您答复。
售后服务包括程序的使用、BUG的处理、意见建议等。不包括技术服务、网站优化、二次开发、环境配置、服务器运维等。
代码类商品属于数字化商品，具有可复制性，不支持退款，详见《网络交易管理办法》第二章 第16条 第三类。
请仔细阅读我们的用户协议：用户协议
本站模板没有任何后门，也不会和我们服务器有任何通信，请您放心使用。
本源码一次性买断，没有二次费用，并享受免费更新。
在使用本站模板时，请不要使用我们的产品从事违反中华人民共和国法律、违反公序良俗的活动，否则我们有权拒绝服务，并配合有关单位予以处置。如果您不符合条件，请勿购买。
售后是指通过QQ与客服联系处理问题，售后过期不影响您对主题的使用和更新。免费三个月售后服务。售后服务时间为工作日早9点到晚5点。如果不在线可以QQ留言，我们会尽快给您答复。
售后服务包括程序的使用、BUG的处理、意见建议等。不包括技术服务、网站优化、二次开发、环境配置、服务器运维等。
代码类商品属于数字化商品，具有可复制性，不支持退款，详见《网络交易管理办法》第二章 第16条 第三类。
请仔细阅读我们的用户协议：用户协议
