请选择 进入手机版 | 继续访问电脑版

PyQt社区|Qt开发-Python开发-PyQt开发-Pyside开发学习!

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 226|回复: 0

js实现复制到剪切板

[复制链接]

55

主题

58

帖子

179

积分

注册会员

Rank: 2

积分
179
发表于 2021-6-30 15:22:25 | 显示全部楼层 |阅读模式
1、第一种,通过clipboard.js插件实现(推荐)
此插件封装了很多种使用方式很方便,具体demo,可以去GitHub上看,clipboard传送门
2、第二种,纯js实现:
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>CopyDemo</title>
  6. </head>
  7. <body>
  8.     <div id=NewsToolBox></div>
  9.     <div id="text-content">      
  10.         <p>测试p1</p>      
  11.         <p>测试p2</p>  
  12.     </div>
  13.     <button id="copy-text-btn">复制</button>
  14. </body>
  15. </html>
  16. <script type="text/javascript">
  17.     // 复制全文
  18.     document.getElementById("copy-text-btn").onclick=function(){
  19.         var ssrsss =document.getElementById("text-content").innerText.replace(/\ +/g, ""); //获取文本并去掉空格
  20.             var flag = copyText(ssrsss); //传递文本
  21.             alert(flag ? '复制成功' : '复制失败')
  22.         };

  23.         function copyText(text) {
  24.             var textarea = document.createElement("textarea"); //创建input对象
  25.             var currentFocus = document.activeElement; //当前获得焦点的元素
  26.             var toolBoxwrap = document.getElementById('NewsToolBox'); //将文本框插入到NewsToolBox这个之后
  27.             toolBoxwrap.appendChild(textarea); //添加元素
  28.             textarea.value = text;
  29.             textarea.focus();
  30.             if (textarea.setSelectionRange) {
  31.                 textarea.setSelectionRange(0, textarea.value.length); //获取光标起始位置到结束位置
  32.             } else {
  33.                 textarea.select();
  34.             }
  35.             try {
  36.                 var flag = document.execCommand("copy"); //执行复制
  37.             } catch (eo) {
  38.                 var flag = false;
  39.             }
  40.             toolBoxwrap.removeChild(textarea); //删除元素
  41.             currentFocus.focus();
  42.             return flag;
  43.         }
  44.     </script>
复制代码


回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|PyQt社区 |网站地图

GMT+8, 2021-9-23 08:29 , Processed in 0.065779 second(s), 19 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表