Поймать переход на другую вкладку

128
23 ноября 2020, 17:10

Есть задача разработать web-приложение для написания сочинения к 9 мая. Сочинение должно писаться по знаниям в голове и без использования поисковых систем. Если пользователь перешел на другую вкладку, то мне нужно очищать форму ввода и писать ошибку о нарушении. Возник вопрос:

Как поймать действиe, когда пользователь уходит с текущей вкладки (кроссбраузерно и кроссплатформенно)?

Answer 1

По вопросу onblur / onfocus поможет?

let p = document.querySelector('p'); 
let t = new Date().getTime(); 
 
window.onblur = function() { 
  document.querySelector('textarea').value = ''; 
  window.onfocus = focus; 
  t = new Date().getTime(); 
} 
 
function focus() { 
  t = new Date().getTime(); 
  document.querySelector('span').innerHTML = 'Вы вернулись, но все уже пропало'; 
} 
 
draw(); 
 
function draw(){ 
  p.innerHTML = ((new Date().getTime() - t)/1000).toFixed(0); 
  requestAnimationFrame(draw) 
}
<span>Если iframe потеряет фокус, все что вы напечатали пропадет</span> 
<p></p> 
<textarea cols=80 rows=10></textarea >

Однако ничего не мешает скопировать содержимое в буфер и потом опять вставить

READ ALSO
Не срабатывает декоратор @Input в Angular 7

Не срабатывает декоратор @Input в Angular 7

Имеются компоненты: родительский container и дочерние add-group и group (экземпляр динамического компонента), являющиеся соседямиВ add-group есть инпут,...

104
Сортировка вложенных массивов

Сортировка вложенных массивов

Необходимо отсортировать массивы по числовому показателю в последнем индексе каждого массиваТо есть, в массиве mass, в коде ниже, mass[2] должен...

106
Синтаксис замыканий в JS

Синтаксис замыканий в JS

Первый раз столкнувшись с замыканиями и не зная, что это такое, пробовал синтаксически понять, что происходит в коде вида: (function(){})()Известно,...

101