如何知道javascript剪贴板“复制”事件的发起者

问题描述

我已经在内容脚本中为剪贴板复制事件注册一个监听器,如下所示:

document.addEventListener("copy",function(event){
    console.log("copy event received");
});

我在以下情况下收到事件:

  1. 键盘上的'Ctrl+C'。

  2. 从右键单击上下文菜单中选择“复制”。

  3. 从工具栏菜单中选择“复制”

    Toolbar copy

在以上 3 种情况下,我都收到了“复制”事件,但我不知道从哪里开始复制。

有没有办法知道复制的来源?例如:“键盘”、“context_menu”、“工具栏”?

解决方法

我想你需要监听你想要监控的事件。类似的东西:

let fromCtrlC = false;
let fromRightClick = false;
document.addEventListener( "copy",evt => {
  console.clear();
  const originatorEvent = fromCtrlC ? "CTRL-C" :
    fromRightClick ? "right click" : "toolbar menu"
  console.log(`Copy event received from ${originatorEvent} within element`,evt.target);
  fromCtrlC = false;
  fromRightClick = false;
});
document.addEventListener( "keydown",evt => 
  fromCtrlC = evt.key.toUpperCase() == 'C' && evt.ctrlKey );
document.addEventListener( "contextmenu",evt => fromRightClick = true );
<div id="hi">Hello</div>
<div id="world">world</div>
<div id="lorem">
Lorem ipsum dolor sit amet,consectetur adipiscing elit,sed 
do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi 
ut aliquip ex ea commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum dolore 
eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat 
non proident,sunt in culpa qui officia deserunt mollit anim id est laborum
</div>