虽然用户自己可以选择文本进行内容的复制到剪贴板,但是有一些场景,我们需要通过一个按钮事件进行当前文本区域内容的复制,这个场景在日常中的需求还是比较常见的,你会怎么做呢?
一、大多人都在用的方法
你可能在用这个方法进行剪贴板的复制
创建一个文本框区域 textarea
然后将你希望复制的内容填充此文本框
接下来将文本框添加至页面
然后使用 select 方法进行文本框内容的选择
然后执行 copy 命令
最后移除 textarea 文本框
基于以上说明,示例代码如下:
function copyToClipboard(text){
const textArea = document.createElement("textarea")
textArea.value = text
document.body.appendChild(textArea)
textArea.focus()
textArea.select()
document.execCommand('copy')
document.body.removeChild(textArea)
}