在 Javascript 中将文本复制到剪切板

2,231 阅读1分钟

js中没有直接将内容复制到剪切板上的函数,需要使用该特性的时候,可以使用textarea的特性曲线救国。实测MacOS Safari, Chrome, iOS, Android兼容。代码如下:

/**
 * 复制文字到剪贴板中
 * @param {String} str
 */
export function copyString(str) {
    const el = document.createElement('textarea')
    el.value = str
    el.setAttribute('readonly', false)
    el.setAttribute('contenteditable', true)
    el.style.position = 'absolute'
    el.style.left = '-99999px'
    document.body.append(el)
    // 保存原有的选择区域
    const selected =
      document.getSelection().rangeCount > 0
        ? document.getSelection().getRangeAt(0)
        : false
    el.select()
    el.setSelectionRange(0, el.textLength) // iOS 中使用 select() 函数无效
    document.execCommand('copy')
    document.body.removeChild(el)
    if (selected) {
        document.getSelection().removeAllRanges()
        document.getSelection().addRange(selected)
    }
}