1、在做点击按钮复制功能时遇到了小小的卡顿,此处遇到了两种系统手机的兼容性 / 复制后会对文本进行选中 / 输入法弹出 等。现将方法进行总结,如下代码很好对解决了以上问题,适用性强。

2、在文本此处使用p标签或者div标签都可

<div class="copy-font">
<div class="uuid-code" id="content">saidfh3is21111h</div>
<button class="btn-copy" id="copyBT">复制</button>
</div>
3、采用对原生js,首先对需要复制对文本进行选中节点,检测设备中是否含有其他的复制文本缓存,进行清除。

将需要复制的文本进行赋值,并调用dom对象的copy功能,返回复制成功提示。

<script type="text/javascript">
function copyArticle(event) {
const range = document.createRange();
range.selectNode(document.getElementById('content'));

const selection = window.getSelection();
if(selection.rangeCount > 0) selection.removeAllRanges();
selection.addRange(range);
document.execCommand('copy');
alert("复制成功!");
}

document.getElementById('copyBT').addEventListener('click', copyArticle, false);
</script>

js兼容安卓和IOS的复制文本到剪切板的更多相关文章

  1. HTML5 完美解决javascript中iphone手机和android手机复制文本到剪切板问题

    1.执行以下解决方案条件:(这个是原理) ①执行复制方法时 所复制文字不能被任何 块级元素和行内块元素和行内元素遮盖否则无效:(解决方案:将文本通过绝对定位或其他方式移除屏幕外) ②ios中不能复制属 ...

  2. jquery 一键复制文本到剪切板

    <a id="copy" data-clipboard-text="123456">复制文本</a> $(function(){ var ...

  3. 用clipboard.js实现纯JS复制文本到剪切板

    以前很多人都是用ZeroClipboard.js来实现网页复制内容,火端也是用它.ZeroClipboard是利用flash来实现的,ZeroClipboard兼容性很好,但是由于现在越来越多的浏览器 ...

  4. JS复制文本到剪切板

    1.首先引入js文件, <script src="dist/clipboard.min.js"></script> 2.初始化 <script typ ...

  5. vue 复制文本到剪切板上

    1.下载clipboard.js npm install vue-clipboard2 --save 2.引入,可以在mian.js中全局引入也可以在单个vue中引入 import Clipboard ...

  6. jquery 复制文本到剪切板插件(非 flash)

    原创插件,转载请声明出处!!! jquery.copy.js 内容如下: /*! * jQuery Copy Plugin * version: 1.0.0-2018.01.23 * Requires ...

  7. 兼容安卓和ios实现一键复制内容到剪切板

    实现代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <m ...

  8. Unity3d 复制文字到剪切板及存储图像到相册

    游戏中里开发分享功能时用到两个小功能:1.复制一个链接到剪切板供在其他应用粘贴分享使用,2.保存一张二维码图像到相册供发送给其他应用用于分享.但是在unity中无法完成,需要分别开发相应的插件. An ...

  9. H5嵌入原生开发小结----兼容安卓与ios的填坑之路

    一开始听说开发H5,以为就是做适配现代浏览器的移动网页,心想不用管IE了,欧也.到今天,发现当初too young too simple,兼容IE和兼容安卓与IOS,后者让你更抓狂.接下来数一下踩过的 ...

随机推荐

  1. JMeter CSRFToken认证登陆(正则提取器的使用)

    转自:http://blog.csdn.net/lion19930924/article/details/51189210 前几天用JMeter模拟登陆,但是这个网站开启了csrf认证,因此在post ...

  2. AD转化器分类及特点和选用

    1. AD转换器的分类 下面简要介绍常用的几种类型的基本原理及特点:积分型.逐次逼近型.并行比较型/串并行型.∑-Δ调制型.电容阵列逐次比较型及压频变换型. 1)积分型(如TLC7135)积分型AD工 ...

  3. 实用 SQL 语句

    1. 创建 1.1 创建数据库 语法:create database db_name 示例:创建应用数据库 awesome_app sqlcreate database `awesome_app` 复 ...

  4. 开发板上如何配置apahe2+mysql+php7

    1,安装apache2 sudo apt-get install apache2 修改webroot vim /etc/apache2/apache2.conf #在其中复制最后一个 <Dire ...

  5. css公共

    @charset "utf-8"; /* CSS Document */ *{ padding:; margin:; } ul,li{ list-style: none; } a{ ...

  6. JavaScript 数组,字符串,函数

    数组 创建数组 利用 new 创建数组 var arr = new Array(); console.log(arr); // Array(0) 数组字面量创建 var arr = []; // 空数 ...

  7. 关于jquery改变onclick方法,最保险的做法

    function a(){ alert("a"); } function b(){ alert("b"); } <input type="but ...

  8. 怎么把项目发布到github上

    方法一:在github上新建一个项目,然后在本地任意个文件夹(最好新建)右键 git bash here   ,再之后 git clone https://github.com/CKTim/BlueT ...

  9. 问题 D: 家庭问题

    问题 D: 家庭问题 时间限制: 1 Sec  内存限制: 128 MB[命题人:admin] 题目描述 有n个人,编号为1,2,……n,另外还知道存在K个关系.一个关系的表达为二元组(α,β)形式, ...

  10. python 中if和elif的区别

    如果程序中判断事件很多,全部用if的话,会遍历整个程序,用elif 程序运行时,只要if或后续某一个elif之一满足逻辑值为True,则程序执行完对应输出语句后自动结束该轮if-elif(即不会再去冗 ...