方法一:
您可以使用JavaScript的document.execCommand()方法将文本内容复制到剪贴板。
以下是一个简单的例子,当用户单击按钮时,它将复制文本到剪贴板:
<button onclick="copyToClipboard('要复制的文本')">复制</button>
<script>
function copyToClipboard(text) {
var textarea = document.createElement("textarea");
textarea.value = text;
document.body.appendChild(textarea);
textarea.select();
document.execCommand("copy");
document.body.removeChild(textarea);
}
</script>
当用户单击按钮时,它会调用copyToClipboard函数,并将要复制的文本作为参数传递。该函数将创建一个隐藏的文本区域,将要复制的文本放入其中,并将其添加到文档中。然后,它选择文本区域中的文本,并使用document.execCommand("copy")方法将其复制到剪贴板中。最后,它将文本区域从文档中删除。
请注意,由于浏览器的安全限制,该方法只能在用户手动操作的情况下才能复制文本。因此,不能使用自动触发单击事件的方式复制文本。
方式二:
使用navigator.clipboard.writeText()方法,该方法允许将指定的文本内容写入到系统剪贴板中。
以下是一个使用navigator.clipboard.writeText()方法的例子:
<p onclick="copyToClipboard('要复制的文本')">要复制的文本</p>
<script>
function copyToClipboard(text) {
navigator.clipboard.writeText(text)
.then(() => {
console.log('文本已成功复制到剪贴板');
})
.catch((err) => {
console.error('复制失败:', err);
});
}
</script>
当用户单击文本时,它会调用copyToClipboard函数,并将要复制的文本作为参数传递。该函数将使用navigator.clipboard.writeText()方法将文本内容写入到系统剪贴板中。如果成功写入剪贴板,则输出一条成功消息,否则输出一个错误消息。
请注意,该方法需要用户授权才能访问系统剪贴板,因此在一些浏览器或环境中可能会出现异常或错误。