封装一个js复制功能的通用函数
时间: 2024-03-27 14:37:55 浏览: 21
可以封装一个通用的 JavaScript 函数,以便在同一页面中多次使用。以下是一个示例代码:
```javascript
function copyToClipboard(text) {
// 创建一个临时的 textarea 元素
const textarea = document.createElement('textarea');
textarea.value = text;
// 将 textarea 元素添加到文档中
document.body.appendChild(textarea);
// 选中文本
textarea.select();
textarea.setSelectionRange(0, textarea.value.length);
// 复制文本
document.execCommand('copy');
// 删除 textarea 元素
document.body.removeChild(textarea);
}
```
该函数接受一个参数 `text`,表示要复制到剪贴板的文本。函数会创建一个临时的 textarea 元素,并将要复制的文本赋值给它。然后将该元素添加到文档中,并选中文本,复制文本,最后删除该元素。
使用该函数非常简单,只需调用 `copyToClipboard` 函数并传入要复制的文本即可。例如:
```javascript
copyToClipboard('要复制的文本');
```
需要注意的是,此方法需要用户的授权才能成功执行。在某些浏览器中,可能需要在用户第一次使用该功能时请求授权。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)