Блог

Главная - Вопросы по программированию - Как узнать инициатора события «копировать» в буфер обмена javascript

Как узнать инициатора события «копировать» в буфер обмена javascript

#javascript #clipboard #clipboarddata

Вопрос:

Я зарегистрировал прослушиватель для события копирования буфера обмена в сценарии содержимого следующим образом:

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

Я получаю событие в следующих случаях:

  1. «Ctrl C» с клавиатуры.
  2. «Копировать» выбирается из контекстного меню правой кнопкой мыши.
  3. «Копировать» выбрано в меню панели инструментов

    Копия панели инструментов

Во всех вышеперечисленных 3 случаях я получаю событие «копировать», но я не знаю, откуда была инициирована копия.

Есть ли способ узнать источник, из которого была создана копия ? Например: «клавиатура», «контекстное меню», «панель инструментов»?

Комментарии:

1. console.log(event); зарегистрируйте событие и попытайтесь найти разницу после его инициирования всеми 3 способами

Ответ №1:

Я полагаю, вам нужны слушатели для событий, которые вы хотите отслеживать. Что-то вроде:

 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' amp;amp; 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>
Метки: