1.执行以下解决方案条件:(这个是原理)

①执行复制方法时 所复制文字不能被任何 块级元素和行内块元素和行内元素遮盖否则无效;(解决方案:将文本通过绝对定位或其他方式移除屏幕外)

②ios中不能复制属性值,只能复制文本元素节点;(解决方案:可以把文字颜色设成背景色就能达到隐藏看不见的效果不影响显示);

直接上代码:以下是伪代码

js代码:

     function img()
{
if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {//区分iPhone设备
window.getSelection().removeAllRanges();//这段代码必须放在前面否则无效
var Url2=document.getElementById("biaoios");//要复制文字的节点
var range = document.createRange();
// 选中需要复制的节点
range.selectNode(Url2);
// 执行选中元素
window.getSelection().addRange(range);
// 执行 copy 操作
var successful = document.execCommand('copy'); // 移除选中的元素
window.getSelection().removeAllRanges();
}else{
var Url2=document.getElementById("biao1");//要复制文字的节点
Url2.select(); // 选择对象
document.execCommand("Copy"); // 执行浏览器复制命令
} }

html布局:

<input readOnly="true" style="outline: none;border: 0px; color: rgba(0,0,0,0.0);position: absolute;left:-200px; background-color: transparent" id="biao1" value=""/>
<div id="biaoios" style=";position: absolute;left:-200px; color: rgba(0,0,0,0);background-color: transparent" ></div>

添加要复制内容的例子:

    $("#biao1").val("要复制的内容");//要复制的内容
document.getElementById("biaoios").innerHTML=要复制的内容+"";

原文:https://blog.csdn.net/u010853130/article/details/66971498

HTML5 完美解决javascript中iphone手机和android手机复制文本到剪切板问题的更多相关文章

  1. 解决JavaScript中构造函数浪费内存的问题!

    解决JavaScript中构造函数浪费内存的问题! 把构造函数中的公共的方法放到构造函数的原型对象上! // 构造函数的问题! function Gouzaohanshu(name, age, gen ...

  2. javascript复制内容到剪切板/网页上的复制按钮的实现

    javascript复制内容到剪切板/网页上的复制按钮的实现:DEMO如下 <!doctype html> <html> <head> <meta chars ...

  3. 如何解决JavaScript中0.1+0.2不等于0.3

    console.log(0.1+0.2===0.3)// true or false?? 在正常的数学逻辑思维中,0.1+0.2=0.3这个逻辑是正确的,但是在JavaScript中0.1+0.2!= ...

  4. 解决IE apk变成zip:Android 手机应用程序文件下载服务器Nginx+Tomcat配置解决方法

    APK文件其实是zip格式,但后缀名被修改为apk,通过UnZip解压后,可以看到Dex文件,Dex是Dalvik VM executes的全称,即Android Dalvik执行程序,并非Java ...

  5. 解决IE apk变成zip:Android 手机应用程序文件下载服务器 配置解决方法

    APK文件其实是zip格式,但后缀名被修改为apk,通过UnZip解压后,可以看到Dex文件,Dex是Dalvik VM executes的全称,即Android Dalvik执行程序,并非Java ...

  6. 解决小米、红米及其他 Android 手机无法在 Mac 下进行真机调试的问题(转)

    转自:http://ju.outofmemory.cn/entry/103522 Begin iOS 2014-08-19 271 阅读 手机 Android 小米 mac 调试 在 Mac OSX ...

  7. 为什么iphone手机比android手机流畅

    作为当下最流行.市场占用份额最大的两大手机操作系统IOS和android,目前两者加起来的市场占用率达到90%.我曾经一直用android手机,没有用过iphone,那时候正直iphone4和ipho ...

  8. 手机端点击复制链接到剪切板(以及PC端)

    一直在找如何能点击按钮将一串字符串放到手机的剪切板上,但是可能是因为搜索的关键字不对,一直无果. 向同事请教了一下,给了一个clickboard.js的插件.开始试验的时候,使用手机自带浏览器进行测试 ...

  9. JavaScript实现无刷新评论及在IE下的剪切板访问(学习)

    1.无刷新评论 tips: appendChild:将新元素作为父元素的最后一个子元素进行添加. insertBefore:在一个指定的子节点之前插入一个节点 实现: <!DOCTYPE htm ...

随机推荐

  1. python全栈开发day38-css三种引入方式、基础选择器、高级选择器、补充选择器

    一.昨日内容回顾 div:分割整个网站,很多块 (1)排版标签 (2)块级标签 独占一行 可以设置高和宽,如果不设置宽高,默认是父盒子的宽 span: (1) 小区域 (2)文本标签 (3)在一行内显 ...

  2. asp.net core web项目目录解读

    Connected Services 和传统.net web项目相比,它的功能类似于添加webservice或者wcf service的引用.暂时用不到,有兴趣的小伙伴可以深入了解.右键这个目录可以看 ...

  3. Python列表split方法

    转载自:https://www.cnblogs.com/douzi2/p/5579651.html 1.split翻译为分裂.  split()就是将一个字符串分裂成多个字符串组成的列表. 2.spl ...

  4. 练习|Django-多表

    models.py from django.db import models # Create your models here. class Author(models.Model): nid = ...

  5. 启用mysql的sql日志

    在mysql命令行或者客户端管理工具中执行:SHOW VARIABLES LIKE "general_log%"; 结果: general_log OFFgeneral_log_f ...

  6. Centos下基于Hadoop安装Spark(分布式)

    前提 Hadoop可成功在分布式系统下启动 下载scala  链接是https://downloads.lightbend.com/scala/2.12.7/scala-2.12.7.tgz Mast ...

  7. 洛谷 P1162 填涂颜色【DFS】

    题目链接:https://www.luogu.org/problemnew/show/P1162 题目描述 由数字 0 组成的方阵中,有一任意形状闭合圈,闭合圈由数字 1 构成,围圈时只走上下左右 4 ...

  8. HDU 1711Number Sequence【KMP模板题】

    <题目链接> 题目大意: 意思是给出两个串,找出匹配串在模式串中的位置. 解题分析: KMP算法模板题. #include <cstdio> #include <cstr ...

  9. Linux 运行Python文件,不因终端关闭而终止运行

    在Linux服务器运行py文件时,有时会因为终端窗口的关闭而结束py文件的执行,这时候使用下面的命令运行py文件: $nohup python filename.py & 命令解释: nohu ...

  10. 由自定义事件到vue数据响应

    前言 除了大家经常提到的自定义事件之外,浏览器本身也支持我们自定义事件,我们常说的自定义事件一般用于项目中的一些通知机制.最近正好看到了这部分,就一起看了下自定义事件不同的实现,以及vue数据响应的基 ...