copyText()安卓,ios11,ios12都可用 ,并且不弹起输入键盘
// 复制copyText
function copyText(text) {
var input = document.createElement("input");
var currentFocus = document.activeElement;
document.body.appendChild(input);
input.readOnly = 'readonly';
input.value = text;
input.focus();
if (input.setSelectionRange)
input.setSelectionRange(0, input.value.length);
else
input.select();
try {
var flag = document.execCommand("copy");
} catch (eo) {
var flag = false;
}
input.blur();
document.body.removeChild(input);
currentFocus.focus();
currentFocus.blur();
return flag;
}
 
 

在 iOS 10 及以下版本 中,使用复制功能有以下限制:

  1. 只能复制 <input> 或 <textarea> 元素中的文本;
  2. 如果包含待复制文本的元素没有包含在一个 <form> 中,那它的 contentEditable 属性必须为 true 
  3. 第2步中的元素同时不能是 readonly 
  4. 待复制文本必须是 被选中 状态。

要满足上述4个限制,代码中需要做到:

  1. 把待复制文本放入 <input> 或 <textarea> 类型的元素 A 中;
  2. 保存 A 元素的 contentEditable 和 readonly 属性,以便复制完成后恢复现场;
  3. 设置 A 元素的 contentEditable 为 true , readonly 属性为 false 
  4. 创建一个 range 对象并挂载 A 元素;
  5. 获取窗口当前选中元素并清除,然后设置选中元素为第4步创建的 range 对象;
  6. 视情况恢复元素 A 的 contentEditable 和 readonly 属性;
  7. 执行 document.execCommand('copy') 

最终实现代码如下:

function copystr(str) {
var el = document.createElement('input');
el.value = str;
el.style.opacity = '0';
document.body.appendChild(el);
var editable = el.contentEditable;
var readOnly = el.readOnly;
el.contentEditable = true;
el.readOnly = false;
var range = document.createRange();
range.selectNodeContents(el);
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
el.setSelectionRange(0, 999999);
el.contentEditable = editable;
el.readOnly = readOnly;
var flag = document.execCommand('copy');
el.blur();
return flag;
}
 
测试,失败,无效,后期更新 

ios9.3.3版本下 document.execCommand("copy") 失败的更多相关文章

  1. LayaAir疑难杂症之三:1.7版本click()、execCommand('copy')函数不生效

    问题描述 在使用Laya1.7引擎开发H5游戏时,引入Js原生函数click( ),模拟一次点击事件,发现无效.在使用Laya1.7引擎开发H5游戏时,引入Js原生函数execCommand('cop ...

  2. Javascript中document.execCommand()的用法

    document.execCommand()方法处理Html数据时常用语法格式如下:document.execCommand(sCommand[,交互方式, 动态参数]) 其中:sCommand为指令 ...

  3. document.execCommand 常用的方法

    execCommand方法是执行一个对当前文档,当前选择或者给出范围的命令.处理Html数据时常用如下格式: document.execCommand(sCommand[,交互方式, 动态参数]) , ...

  4. javascript的document.execCommand(转)

    document.execCommand()方法处理html数据时常用语法格式如下: 代码: document.execCommand(sCommand[,交互方式, 动态参数]) 其 中:sComm ...

  5. document.execCommand()函数可用参数解析

    隐藏在暗处的方法-execCommand() 关键字: javascript document document.execCommand()方法可用来执行很多我们无法实现的操作. execComman ...

  6. 前端复制功能的若干 -- document.execCommand()

    最近涨停科技公司实习,由于backend基础太弱...强行前端了一把..搞了两周才搞下页面里copy的功能,期间有些琐碎,恐忘,记录在此. 目前copy主流有四种方式:ZeroClipboard,Cl ...

  7. document.execCommand()的用法小记

    项目中遇到金额输入框限制只能输入数字,输入特殊字符或者字母汉字时间隔不到1秒内容就会自动清空.跟正则纠缠多年的我初次见到,很是神奇-.- 代码实现: <input type="text ...

  8. JS document.execCommand实现复制功能(带你出坑)

    最近项目中需要实现功能:点击button,复制input框的值: 我使用的是 document.execCommand('copy')的方法: 但是很郁闷的是,始终实现不了功能:代码如下 HTML代码 ...

  9. JavaScript:document.execCommand()的用法

    document.execCommand()的用法小记 一.语法 execCommand方法是执行一个对当前文档,当前选择或者给出范围的命令.处理Html数据时常用. 如下格式:document.ex ...

随机推荐

  1. 二维码识别项目zxing横屏改为竖屏

    第1步: 在AndroidManifest中将CaptureActivity的screenOrientation属性做如下修改: android:screenOrientation="por ...

  2. Ubuntu卸载通过apt-get命令安装的软件

    卸载一个已安装的软件包(删除配置文件): apt-get --purge remove packagename

  3. JS函数式编程 - 概念

    最近在看Typescript,顺便看了一些函数式编程,然后半个国庆假期就没有了.做个笔记,分几个部分写吧. 最开始接触函数式编程的时候,第一个接触的概念就是高阶函数,和柯里化.咋一看,这不就是长期用来 ...

  4. JS 鼠标键盘HTML事件

  5. python 正则表达式常用操作符

  6. 怎么用PHP+sqlite3验证登录用户名和密码

    Session:在计算机中,尤其是在网络应用中,称为“会话控制”.Session 对象存储特定用户会话所需的属性及配置信息.这样,当用户在应用程序的 Web 页之间跳转时,存储在 Session 对象 ...

  7. spark-ML基础

    一.ML组件 ML的标准API使用管道(pipeline)这样的方式,可以将多个算法或者数据处理过程整合到一个管道或者一个流程里运行,其中包含下面几个部分: 1. dataFrame:用于ML的dat ...

  8. python字符串函数总结

    字符串函数主要分为: 查找: strs = "this is a line of text for test" index1 = strs.find("is") ...

  9. sping,springMVC @Component 注解的对象都是单例模式,变量不能全局

    错误方式:      将属性和变量定义为全局,单例模式,所有人共享,导致所有人的数据都发生错误! 正确方式 一:    将变量定义到局部,互不影响. 正确方式 二:      假如必须放到全局所有方法 ...

  10. Node.js入门笔记

    第一步自然是安装了.我是用Webstorm这个ide,安装分2步: 1.安装nodejs,下载Windows下的安装版本号.注意是以msi为扩展名的,然后下一步.没啥好说的,下载地址例如以下: 32位 ...