js 实现点击后复制文本
时间: 2023-11-16 14:04:04 浏览: 100
js实现点击按钮复制文本功能
要实现点击后复制文本的功能,你可以使用以下 JavaScript 代码:
```javascript
function copyText() {
// 获取要复制的文本
var textToCopy = document.getElementById("copytext-plate-output").value;
// 创建一个临时的 textarea 元素
var tempTextarea = document.createElement("textarea");
tempTextarea.value = textToCopy;
// 将 textarea 元素添加到文档中
document.body.appendChild(tempTextarea);
// 选中 textarea 中的文本
tempTextarea.select();
// 复制文本
document.execCommand("copy");
// 移除临时的 textarea 元素
document.body.removeChild(tempTextarea);
// 提示复制成功
alert("文本已复制到剪贴板");
}
```
在你的 HTML 中,添加一个触发复制操作的按钮,并为其添加一个点击事件处理程序:
```html
<button onclick="copyText()">复制文本</button>
```
当用户点击按钮时,`copyText` 函数将获取要复制的文本,创建一个临时的 textarea 元素,将文本设置为其值,并将其添加到文档中。然后,它选中 textarea 中的文本,并使用 `document.execCommand("copy")` 命令复制文本到剪贴板。最后,它移除临时的 textarea 元素,并提示复制成功。
请确保将按钮的 `onclick` 属性设置为 `copyText()`,以便在用户点击按钮时调用 `copyText` 函数。
阅读全文