js复制数据到剪切板

方法一:

在下面方法传入你想要复制的字符 ,直接调用该方法就好

export function copyText(text: string) {if (navigator.clipboard) {// clipboard api 复制navigator.clipboard.writeText(text)} else {const textarea = document.createElement('textarea')document.body.appendChild(textarea) textarea.style.position = 'fixed'// 隐藏此输入框textarea.style.clip = 'rect(0 0 0 0)'textarea.style.top = '10px' textarea.value = text // 赋值textarea.select() // 选中document.execCommand('copy', true)// 复制document.body.removeChild(textarea) // 移除输入框}
}// 使用  
copyText('复制的字符')

方法二:

export function copyText(text: string) {var textarea = document.createElement("textarea");document.body.appendChild(textarea);// 隐藏此输入框textarea.style.position = "fixed";textarea.style.clip = "rect(0 0 0 0)";textarea.style.top = ".15625rem";// 赋值textarea.value = text;// 选中textarea.select();// 复制try {var msg = document.execCommand("copy") ? "成功" : "失败";// alert('复制' + msg);} catch (err) {// alert('不能使用这种方法复制内容');}// 移除输入框document.body.removeChild(textarea);
}

上面的两个方法,有时候安卓手机的,没有开系统权限,就好报错:

方法三:下面这样简化的复制写法就可以

// 文件文案  使用  copyText('复制的字符')
export function copyText(text: string) {// 要复制的文案// let text = "这是需要复制的文案";// 创建一个临时的 input 元素let input = document.createElement('input');// 将文案赋值给 input 元素的 value 属性input.value = text;// 将 input 元素添加到页面中document.body.appendChild(input);// 选中 input 元素的内容input.select();// 执行复制操作document.execCommand('copy');// 移除临时的 input 元素document.body.removeChild(input);
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/503151.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

服务器Ubuntu22.04系统下 ollama的详细部署安装和搭配open_webui使用

服务器Ubuntu22.04系统下 ollama的详细部署安装和搭配open_webui使用 一、ubuntu和docker基本环境配置1.更新包列表:2. 安装docker依赖3. 添加docker密钥4.添加阿里云docker软件源5.安装docker6.安装完成docker测试7. docker配置国内镜像源 二、安装英伟达显卡驱动1…

LInux单机安装Redis

1. 安装gee工具包 由于Redis是基于c语言编写的所以安装的时候需要先安装gee以及gcc的依赖,yum云用不了可以看一下这个 linux 替换yum源镜像_更换yum镜像源-CSDN博客 yum install -y gcc tcl 2. 添加redis的压缩包 3. 上传到Linux 上传到 /usr/local/src 目录、这个目录一般用于…

西门子200smart存储卡作用

最近维修设备时,遇到一个问题,设备PLC是200smart SR20,PLC程序需要修改某个程序段,由于手里没有源程序,联系厂家后,厂家发了一段程序,后缀是.s7s。通过查询官网资料,其中S7_JOB.S7S为脚本任务&a…

QT上实现SVM进行数据分类

针对不了解SVM的原理的同学强推下面这个课程: 6.机器学习课程(六)支持向量机(线性模型)问题_哔哩哔哩_bilibili 一、QT实现SVM的方法 1.调用SVM的C语言库:麻烦,要专门去找库,cmak…

【C++】字符串与字符数|组操作详解:strcpy 和 strcat 的使用与解析

博客主页: [小ᶻ☡꙳ᵃⁱᵍᶜ꙳] 本文专栏: C 文章目录 💯前言💯一、字符串数组的基本操作💯二、strcpy 的用法详解1. strcpy 的功能与原型2. 使用示例与代码演示3. 注意事项4. 扩展:为什么不能直接用 &#xff1f…

GWAS数据和软件下载

这部分主要是数据获取,以及软件配置方法。 一、配套数据和代码 数据和代码目前在不断的更新,最新的教程可以私信,我通过后手动发送最新版的pdf和数据代码。发送的压缩包,有电子版的pdf和数据下载链接,里面是最新的百度网盘的地址,下载到本地即可。然后根据pdf教程,结合配套的…

Vue笔记-001-声明式渲染

https://cn.vuejs.org/tutorial/#step-2https://cn.vuejs.org/tutorial/#step-2 Vue 单文件组件 (Single-File Component,缩写为 SFC) 单文件组件是一种可复用的代码组织形式,它将从属于同一个组件的 HTML、CSS 和 JavaScript 封装在使用 .vue 后缀的文件…

Scala_【5】函数式编程

第五章 函数式编程函数和方法的区别函数声明函数参数可变参数参数默认值 函数至简原则匿名函数高阶函数函数作为值传递函数作为参数传递函数作为返回值 函数闭包&柯里化函数递归控制抽象惰性函数友情链接 函数式编程 面向对象编程 解决问题时,分解对象&#xff…

(六)优化 ChatGPT 交互:任务式 Prompt 的力量

📢📢📢 大家好,我是云楼Yunlord,CSDN博客之星人工智能领域前三名,多年人工智能学习工作经验,一位兴趣稀奇古怪的【人工智能领域博主】!!!😜&#…

HarmonyOS-面试资料

1. HarmonyOS-面试资料 1.1. HarmonyOS 优点、特点 1.1.1. 优点 (1)在国家方面,是国产的系统,受国家支持不会有限制的情况。   (2)设备互连18N(1:手机 8:平板、PC、vr设备、可穿戴设备、智慧…

R语言基础| 中级绘图

写在前面 前面第六章的图形主要是展示单分类变量或连续型变量的分布情况。本章主要研究二元变量或多元变量关系的可视化。更多教程可参考: R语言基础学习手册 图片集锦: 11.1 散点图 1)添加最佳拟合曲线的散点图: 绘制汽车重…

神经网络第一课

目录 背景知识生物神经元人工神经元模型神经网络训练神经网络结论背景知识 神经网络是一种人工智能模型,其主要受生物神经系统启发,重现了大脑中神经元之间相互连接的方式。 神经网络已在很多领域中取得显著成就,如图像识别、自然语言处理和语音识别等。 生物神经元 神经…

Docker:安装 XXL-JOB 分布式调度任务的技术指南

1、简述 XXL-JOB 是一个分布式任务调度平台,提供简单易用的任务调度功能。它支持分布式调度、失败重试、任务监控和报警等功能。XXL-JOB 采用了服务端与执行器的架构,任务调度在服务端进行,而任务的实际执行则由各个执行器完成。 XXL-JOB 的…

Git revert回滚

回退中间的某次提交(此操作在预生产分支上比较常见),建议此方式使用命令进行操作(做好注释,方便后续上线可以找到这个操作) Git操作: 命令:revert -n 版本号 1:git re…

新年到了!使用Python创建一个简易的接金元宝游戏

引言 在本教程中,我们将一起学习如何使用Python编程语言和Pygame库来创建一个简单的休闲游戏——“接金元宝”。 准备工作 首先,确保你的计算机上已经安装了Python(推荐3.6以上版本)和Pygame库。如果还没有安装Pygame&#xff0…

GoF23种设计模式 简介

文章目录 面向对象(OO)设计原则(7)单一职责原则开闭原则里氏代换原则依赖倒转原则接口隔离原则合成复用原则迪米特法则 创建型模式 (5)工厂方法模式 (类模式,其余都是对象模式)抽象工厂模式建造…

【数电尾灯设计】2022-8-16

缘由数电尾灯设计问题,求解答--CSDN问答 从题目可以列出 000 100 010 111-----------4进制 000 100 010 110 001 101 011 111-----------8进制 由列出可知用16进制芯片的3个引脚可以获得8进制推导出4进制从而可用逻辑处理为4进制实现尾灯功能。之上第一步实现了尾灯…

在线机考|2024华为实习秋招春招编程题(最新)——第3题_个性化歌单推荐系统_300分(十一)

题目内容 假设你是音乐服务的开发者,为了提高用户体验需要解决推荐歌单的同质化问题,保证推荐给用户的所有歌单不包含相同歌曲的。给定一个包含N个歌单和M条歌单重复记录,每个歌单用一个从1到N的整数编号,歌单重复记录包含两个歌单的ID,表示两个歌单有相同的歌曲。 你的任…

Ant Design Pro写项目的总结经验(react)

配置代理(proxy) 在config文件夹下面的config.ts里面配置修改 修改前:修改后: 修改账号框以及登录接口以及登录返回的code 由于它的账号框是username,但是我们接口请求要填写的是account,因此可以全局搜索进行替换…

安卓14无法安装应用解决历程

客户手机基本情况: 安卓14,对应的 targetSdkVersion 34 前天遇到了安卓14适配问题,客户发来的截图是这样的 描述:无法安装我们公司的B应用。 型号:三星google美版 解决步骤: 1、寻找其他安卓14手机测试…