HTML5 完美解决javascript中iphone手机和android手机复制文本到剪切板问题
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手机复制文本到剪切板问题的更多相关文章
- 解决JavaScript中构造函数浪费内存的问题!
解决JavaScript中构造函数浪费内存的问题! 把构造函数中的公共的方法放到构造函数的原型对象上! // 构造函数的问题! function Gouzaohanshu(name, age, gen ...
- javascript复制内容到剪切板/网页上的复制按钮的实现
javascript复制内容到剪切板/网页上的复制按钮的实现:DEMO如下 <!doctype html> <html> <head> <meta chars ...
- 如何解决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!= ...
- 解决IE apk变成zip:Android 手机应用程序文件下载服务器Nginx+Tomcat配置解决方法
APK文件其实是zip格式,但后缀名被修改为apk,通过UnZip解压后,可以看到Dex文件,Dex是Dalvik VM executes的全称,即Android Dalvik执行程序,并非Java ...
- 解决IE apk变成zip:Android 手机应用程序文件下载服务器 配置解决方法
APK文件其实是zip格式,但后缀名被修改为apk,通过UnZip解压后,可以看到Dex文件,Dex是Dalvik VM executes的全称,即Android Dalvik执行程序,并非Java ...
- 解决小米、红米及其他 Android 手机无法在 Mac 下进行真机调试的问题(转)
转自:http://ju.outofmemory.cn/entry/103522 Begin iOS 2014-08-19 271 阅读 手机 Android 小米 mac 调试 在 Mac OSX ...
- 为什么iphone手机比android手机流畅
作为当下最流行.市场占用份额最大的两大手机操作系统IOS和android,目前两者加起来的市场占用率达到90%.我曾经一直用android手机,没有用过iphone,那时候正直iphone4和ipho ...
- 手机端点击复制链接到剪切板(以及PC端)
一直在找如何能点击按钮将一串字符串放到手机的剪切板上,但是可能是因为搜索的关键字不对,一直无果. 向同事请教了一下,给了一个clickboard.js的插件.开始试验的时候,使用手机自带浏览器进行测试 ...
- JavaScript实现无刷新评论及在IE下的剪切板访问(学习)
1.无刷新评论 tips: appendChild:将新元素作为父元素的最后一个子元素进行添加. insertBefore:在一个指定的子节点之前插入一个节点 实现: <!DOCTYPE htm ...
随机推荐
- android和java以太坊开发区块链应用使用web3j类库
如何使用web3j为Java应用或Android App增加以太坊区块链支持,教程内容即涉及以太坊中的核心概念,例如账户管理包括账户的创建.钱包创建.交易转账,交易与状态.智能合约开发与交互.过滤器和 ...
- Java开发人员必须掌握的Linux命令(二)
子曰:"工欲善其事,必先利其器." 学习应该是快乐的,在这个乐园中我努力让自己能用简洁易懂(搞笑有趣)的表达来讲解让知识或者技术,让学习之旅充满乐趣,这就是写博文的初心. 本篇的旅 ...
- 安卓 logcat设置 Android logcat Settings
安卓 logcat设置 Android logcat Settings 作者:韩梦飞沙 Author:han_meng_fei_sha 邮箱:313134555@qq.com E-mail: 3131 ...
- ab测试swoole和ngixn+php-fpm对比
做个swoole http_server和ngixn+php7-fpm测试 nginx swoole卓越的性能让我惊呆了 如需应用可nginx反代, swoole作为http_server, 不用 ...
- [TC14126]BagAndCards
[TC14126]BagAndCards 题目大意: 有\(n(n\le500)\)个袋子,第\(i\)个袋子里有\(count[i][j]\)张值为\(j(j\le m\le500)\)的牌.给一个 ...
- ecshop jquery 冲突
遇到冲突在脚本前面加上这句 $(function() { window.__Object_toJSONString = Object.prototype.toJSONString; delete Ob ...
- spring源码分析系列 (1) spring拓展接口BeanFactoryPostProcessor、BeanDefinitionRegistryPostProcessor
更多文章点击--spring源码分析系列 主要分析内容: 一.BeanFactoryPostProcessor.BeanDefinitionRegistryPostProcessor简述与demo示例 ...
- __Linux__文件和目录
Linux 目录 /:根目录,一般根目录下只存放目录,在Linux下有且只有一个根目录.所有的东西都是从这里开始.当你在终端里输入“/home”,你其实是在告诉电脑,先从/(根目录)开始,再进入到ho ...
- spyder 安装
https://www.cnblogs.com/pcat/p/5398997.html
- [Android Pro] https://blog.csdn.net/gaugamela/article/details/79143309
原文地址:https://blog.csdn.net/gaugamela/article/details/79143309 最近遇到这样一个问题: 第三方的SDK除了Jar包外,还提供了对应的so文件 ...