更新!iOS> = 10
看起来像是在选择范围和一些小技巧的帮助下,可以直接复制到iOS(> = 10)Safari上的剪贴板。我在iPhone 5C iOS
10.3.3和iPhone 8 iOS 11.1上对此进行了亲自测试。但是,似乎存在一些限制,这些限制是:
- 只能从
<input>
和<textarea>
元素复制文本。 - 如果包含文本的元素 不 在内
<form>
,那么它必须在内contenteditable
。 - 拿着文本的元素一定 不能 是
readonly
(虽然你可能会尝试,这不是一个“官方”方法记载任何地方)。 - 元素内的文本必须在选择范围内。
要满足所有这四个“要求”,您将必须:
- 将要复制的文本放在
<input>
或<textarea>
元素内。 - 保存元素的
contenteditable
和的旧值,readonly
以便能够在复制后还原它们。 - 更改
contenteditable
到true
和readonly
到false
。 - 创建一个范围以选择所需的元素,并将其添加到窗口的选择中。
- 设置整个元素的选择范围。
- 恢复先前的
contenteditable
和readonly
值。 - 运行
execCommand('copy')。
这将导致用户设备的插入符号移动并选择所需元素中的所有文本,然后自动发出复制命令。用户将看到被选中的文本,并显示带有选择/复制/粘贴选项的工具提示。
现在,这看起来有点复杂,发出一个复制命令太麻烦了,所以我不确定这不是Apple的预期设计选择,但是谁知道…同时,这 目前可行在iOS > =
10上。
工作实例
总而言之,您需要的代码如下所示:
function iosCopyToClipboard(el) { var oldContentEditable = el.contentEditable, oldReadonly = el.readOnly, range = document.createRange(); el.contentEditable = true; el.readonly = false; range.selectNodeContents(el); var s = window.getSelection(); s.removeAllRanges(); s.addRange(range); el.setSelectionRange(0, 999999); // A big number, to cover anything that could be inside the element. el.contentEditable = oldContentEditable; el.readonly = oldReadOnly; document.execCommand('copy');}请注意,
el此函数的参数必须为
<input>或
<textarea>。
旧答案:以前的iOS版本
在 iOS
<10上,剪贴板API对Safari有一些限制(实际上是安全措施):
- 它
copy
仅在有效选择上cut
并且paste
仅在集中的可编辑字段中触发事件。 - 它仅支持通过快捷键(而不是通过)进行OS剪贴板的读写
document.execCommand()
。请注意,“快捷键”是指一些可单击的键(例如,复制/粘贴操作菜单或自定义iOS键盘快捷键)或物理键(例如,已连接的蓝牙键盘)。 - 它不支持
ClipboardEvent
构造函数。
因此(至少到目前为止) ,无法使用Javascript在iOS设备上的剪贴板中以编程方式复制一些文本/值 。只有用户可以决定是否复制某些内容。
但是,可以通过编程方式选择某些内容
,以便用户仅需点击所选内容上显示的“复制”工具提示。这可以通过使用与上面完全相同的代码来实现,只需删除
execCommand('copy'),这实际上是行不通的。


