// 点击复制到剪贴板
const copyToClipboard = (content)=> {
if (window.clipboardData) {
window.clipboardData.setData("text", content);
} else {
(function (content) {
document.oncopy = function (e) {
e.clipboardData.setData("text", content);
e.preventDefault();
document.oncopy = null;
};
})(content);
document.execCommand("Copy");
}
}
 // 点击复制到剪贴板    (兼容ios)
const copyToClipboard = (content)=> {
let oInput = document.createElement("input");
oInput.value = content;
document.body.appendChild(oInput);
oInput.select(); // 选择oInput中所有文本对象
    if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {//兼容ios
if (!document.execCommand("Copy")) {
oInput.setSelectionRange(0, oInput.value.length);
}
}
document.execCommand("Copy"); // 执行浏览器复制命令
document.body.removeChild(oInput);
return new Promise((resolve,reject)=>{
if (document.execCommand("Copy")) {
resolve(content);
}else{
reject(content);
}
})
}

注释:setSelectionRange()方法是作用在input元素上的;这个方法可以为当前元素内的文本设置备选中范围;inputElement.setSelectionRange(selectionStart, selectionEnd, [optional] selectionDirection);

复制文本到粘贴板 (vue3)(兼容ios)的更多相关文章

  1. JavaScript实现点击复制按钮复制文本框的内容,兼容IOS

    <lable> <input type="text" id="txt"> <a href="javascript:;&q ...

  2. js插件实现点击复制内容到粘贴板,兼容IE8

    先来看下本次需要导入的文件: 第一个是jquery.js,这个不多说: 第二个是jquery.zclip.js,第三个是zeroClipboard.swf ,这两个文件的下载链接:http://www ...

  3. 原生js实现复制文本到粘贴板

    项目中经常会遇到点击按钮复制订单号.订单id等内容到粘贴板中的需求.可是通常我们都是用Ctrl + c或右击复制的,别操心,js也是有复制命令的,那就是document.execCommand('co ...

  4. js 复制文本到粘贴板

    //html 在iOS Safari中,剪贴板API有一些限制(实际上是安全措施):   于安全原因,iOS Safari只允许容器中的document.execCommand('copy')文本co ...

  5. JS复制文本到粘贴板,前端H5移动端点击按钮复制文本

    <span id="codeNum">FTYHDSDW</span> <span class=" code-btn" id=&qu ...

  6. Ubuntu Vim 复制到系统粘贴板

    /************************************************************************* * Ubuntu Vim 复制到系统粘贴板 * 说 ...

  7. js实现复制内容到粘贴板

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  8. js 复制文字、 复制链接到粘贴板

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. js点击按钮复制内容到粘贴板

    复制内容到粘贴板,就是要选择需要复制的内容并执行document.execCommand("copy")命令: //复制内容到粘贴板 function copyToClipboar ...

  10. H5和PC实现点击复制当前文字的功能,兼容ios,安卓

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. P1068 [NOIP2009 普及组] 分数线划定 题解

    目录 题目 思路 code 题目 P1068 [NOIP2009 普及组 思路 算出人数 排序 输出 如果同分也输出 否则break code #include<bits/stdc++.h> ...

  2. kibana7.6.2内网windows系统下编译打包部署

    1.在kibana根目录下执行命令: yarn build  --skip-os-packages 2.报错无法下载node:将node相关文件下载放到kibana/.node_binaries/10 ...

  3. DDD(三)DDD实战、贫血模型与充血模型

    DDD(三)DDD实战.贫血模型与充血模型 如果觉得样式不好:跳转即可 http://www.lifengying.site/(md文件复制过来有些样式会不一样) 贫血模型与充血模型 1.贫血模型:一 ...

  4. MySQL8.0的下载、安装、配置

    转1: MySQL8.0的下载.安装.配置 MySQL8安装教程(下载.安装.连接.卸载) Navicat Premium 15激活(含注册机)

  5. Feign熔断

    在Feign中使用 @EnableFeignClients中已经默认打开了断路器功能,所以这里的启动类上不需要再加@EnableCircuitBreaker注解 只需要在@FeignClient中为f ...

  6. 生产者消费者demo

    using System; using System.Collections.Generic; using System.Threading; namespace 生产者消费者 { class Pro ...

  7. 一种基于Modbus的工业通信网关设计

    近年来,随着工业自动化领域的发展,工业现场对网络的可靠性及成本有极高的要求.传统基于串口的工业网关可以满足工业现场的应用,但却要付出高额成本.一种基于 ModBus 设计的工业通信网关就走进人们的眼中 ...

  8. 再见IE

  9. noi 1.1 6 空格分隔输出

    描述 读入一个字符,一个整数,一个单精度浮点数,一个双精度浮点数,然后按顺序输出它们,并且要求在他们之间用一个空格分隔.输出浮点数时保留6位小数. 输入 共有四行:第一行是一个字符:第二行是一个整数: ...

  10. java中的数组遍历(简便小方法)

    int[] a = {1,2,3,4}; for(int k:a){ System.out.println(k); //注意冒号后面直接写数组名即可. //注意,k的值就是数组a中某一项的值,即语句& ...