1 <!DOCTYPE html> 2 <html> 3 ??<head> 4 ????<meta charset="utf-8" /> 5 ????<title>js复制内容到粘贴板</title> 6 ????<style> 7 ??????.flex-r { 8 ????????display: flex; 9 ????????flex-direction: row;10 ????????align-content: center;11 ????????justify-content: space-between;12 ??????}13 ??????.info {14 ??????????max-width: 400px;;15 ????????margin-bottom: 20px;16 ????????background-color: bisque;17 ??????}18 ??????dl {19 ????????margin: 0;20 ????????padding: 0 30px;21 ????????width: 200px;22 ??????}23 ??????.copy{24 ????????cursor: pointer;25 ????????margin: 0 10px;26 ??????}27 ????</style>28 ??</head>29 30 ??<body>31 ????<div class="bank_info">32 ??????<div class="flex-r info">33 ????????<dl class="flex-r aln-star">34 ??????????<dt>收款银行：</dt>35 ??????????<dd>建设银行</dd>36 ????????</dl>37 ????????<span class="copy" onclick="mmcopy(this)">复制</span>38 ??????</div>39 ??????<div class="flex-r info">40 ????????<dl class="flex-r aln-start">41 ??????????<dt>收款账户名：</dt>42 ??????????<dd>张三</dd>43 ????????</dl>44 ????????<span class="copy" onclick="mmcopy(this)">复制</span>45 ??????</div>46 ????</div>47 48 ????<!--引入jQuery插件 -->49 ????<script src="./js/jquery.min.js"></script>50 ????<script>51 ??????function mmcopy(e) {52 ????????if (document.execCommand("copy")) {53 ??????????var txt = ""; // 需要复制的文字54 ??????????txt += $(e)55 ????????????.siblings("dl")56 ????????????.find("dt")57 ????????????.text();58 ??????????txt += $(e)59 ????????????.siblings("dl")60 ????????????.find("dd")61 ????????????.text();62 ??????????const input = document.createElement("input"); // 创建一个新input标签63 ??????????input.setAttribute("readonly", "readonly"); // 设置input标签只读属性64 ??????????input.setAttribute("value", txt); // 设置input value值为需要复制的内容65 ??????????document.body.appendChild(input); // 添加input标签到页面66 ??????????input.select(); // 选中input内容67 ??????????input.setSelectionRange(0, 9999); // 设置选中input内容范围68 ??????????document.execCommand("copy"); // 复制69 ??????????document.body.removeChild(input); ?// 删除新创建的input标签70 ????????}71 ??????}72 ????</script>73 ??</body>74 </html>js实现复制内容到粘贴板
原文地址：https://www.cnblogs.com/zhenguo-chen/p/10454521.html