复制到悬停时的剪贴板

Copy to clipboard on hover

本文关键字:剪贴板 悬停 复制      更新时间:2023-09-26

我试图将文本复制到悬停的剪贴板上,并注意到它只适用于点击(document.body.addEventListener('click', copy, true);),但是当你试图触发悬停复制时,它不起作用(document.body.addEventListener('mouseover', copy, true);)。我一直在摆弄这个例子,想知道为什么会这样。

document.execCommand需要一个用户事件来工作。它不会在悬停时工作,但它会在点击和类似的(鼠标向下,鼠标向上等)。

您可能仍然需要检查兼容性(在这里)。参考这个原始答案和(这个)jsFiddle。现在浏览器似乎都一致支持它,但你仍然需要确保你想要在表中针对这些版本。

$('.big').hover(function () {
    // will not work, no user action
  $('input').select();
    document.execCommand('copy');
});
$('.big').mousedown(function () {
    //works
  document.execCommand('copy');
});

从document.execCommand()触发的复制命令只会影响真实剪贴板的内容,如果事件是从用户信任并触发的事件调度的,或者如果实现配置为允许这样做。如何配置实现以允许对剪贴板进行写访问不在本规范的范围内。