ios无法复制

juejin.cn/post/696922… ios部分机型不支持input.select()方法，导致无法选中，所以无法执行document.execCommand('copy')复制操作；

clipboard.js内部用了一个select的npm包；这个包主要是去选中复制的内容

摘取部分核心代码展示：

var isReadOnly = element.hasAttribute('readonly');
if (!isReadOnly) {
    element.setAttribute('readonly', '');
}
element.select();
element.setSelectionRange(0, element.value.length); //重点是这句话

if (!isReadOnly) {
    element.removeAttribute('readonly');
}

发现了吗？他跟我上面的代码主要是多了element.setSelectionRange(0, element.value.length);

原来如此，通过文本选区去选中文本，妙啊；

mdn的解释：

HTMLInputElement.setSelectionRange 方法用于设定<input> 或 <textarea> 元素中当前选中文本的起始和结束位置。

HTMLInputElement.setSelectionRange(selectionStart, selectionEnd [, selectionDirection]);

接受三个参数；
第一个参数：字符串开始索引
第二个参数：字符串结束索引
第三个参数：表示选择方向的字符串，可选值有
forward： 从开头开始选
backward： 从结尾开始选
none： 默认值，表示方向未定

大家可以通过setSelectionRange这个链接查看更多内容

解决方法

最后我加上这个setSelectionRange方法，测试通过，ios和安卓都正常；

完整代码如下：

  /**
   * 复制文本
   * @param {string} text 复制的文本
   */
  copyText (text) {
    const input = document.createElement('input')
    document.body.appendChild(input)
    input.setAttribute('readonly', 'readonly')
    input.setAttribute('value', text)
    input.select()
    input.setSelectionRange(0, text.length)
    try {
      document.execCommand('copy')
    } catch (err) { }
    document.body.removeChild(input)
  }

产品-网盘下载-useCopy