2 способа определить, когда пользователи переключают вкладки браузера: использование прослушивателей событий focus и blur и использование прослушивателя событий "visibilitychange"
Если вы студент, который сдавал тесты в онлайн-режиме, особенно в те дни Covid, вы должны помнить о боли получения уведомлений, когда вы пытались изменить вкладку экзамена.
Да, я знаю, что ALT + C также был вариантом для списывания или довольно умным вариантом поиска во время экзаменов😜 но разве вам не интересно узнать, как это происходит? Я имею в виду, как они могут определить, когда мы меняем вкладки или кликаем где-то за пределами окна экзамена?🤔
Итак, будьте готовы, сейчас я познакомлю вас с некоторыми слушателями событий, которые помогут вам определить, когда ваш клиент или пользователь меняет ваш веб-сайт на другой веб-сайт или щелкает за пределами вашего веб-сайта / области вкладки.
Есть два метода:
Способ 1. Использование прослушивателей событий фокуса и размытия
В этом методе мы используем два прослушивателя событий "focus" и "blur".
Когда вы переключаетесь на другую вкладку или щелкаете за пределами вкладки в другом месте окна, активируется размытие.
Затем снова вернитесь на вкладку или щелкните область вкладки, после чего активируется фокус.
Способ 2. Использование прослушивателя событий «visibilitychange»
В этом методе мы будем использовать только прослушиватель событий «visibilitychange», у которого есть свойство, называемое «vsisibilityState», которое возвращает значение «скрыто», когда вы переключаете вкладку, и «видимо», когда вы возвращаетесь снова.
Разница между методом 1 и методом 2 заключается в том, что первый обнаруживает, даже когда вы щелкаете за пределами области вкладок, а второй обнаруживает только при переключении вкладок.
Надеюсь, вы узнали что-то новое.
Расскажите в комментариях, какой способ кажется вам простым.😉
Подпишитесь на еженедельные технические публикации.
Дополнительные материалы на PlainEnglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter, LinkedIn, YouTube и Discord . Заинтересованы в хакинге роста? Ознакомьтесь с разделом Схема.
