首页 > 解决方案 > 为什么使用 JavaScript 无法复制到剪贴板?

问题描述

我正在尝试这个功能:

function copyToClipboard(str) {

const el = document.createElement('textarea');
el.textContent = str;
el.setAttribute('readonly', '');
el.style.position = 'absolute';
el.style.left = '-9999px';
document.body.appendChild(el);
const selected =
    document.getSelection().rangeCount > 0 ?
    document.getSelection().getRangeAt(0) :
    false;
el.select();
document.execCommand('copy');
document.body.removeChild(el);
if (selected) {
    document.getSelection().removeAllRanges();
    document.getSelection().addRange(selected);
}
alert("Success");}

我试过 el.value = str; 也。我究竟做错了什么?

标签: javascriptclipboardcopy-paste

解决方案


document.execCommand弃用但仍可跨网络浏览器访问

navigator.clipboard API是一个替代的navigator.clipboard

您将要复制到剪贴板的文本像这样传递

navigator.clipboard.writeText(str_to_copy).then(success_callback, failure_callback);

请注意,该选项卡必须处于活动状态才能正常工作,否则您将无权复制剪贴板

API 是异步的,因此您可以使用.then回调来提醒用户复制剪贴板是否成功。查看Can I Use以了解其在 Web 浏览器中的可用性。


推荐阅读