Вы можете легко имитировать щелчки мыши в javascript с помощью конструктора MouseEvent.
В настоящее время процесс моделирования распространен среди программистов, чтобы избежать выполнения задач самостоятельно, и очевидно, почему они делают это самостоятельно, когда они могут моделировать тот процесс, который будет работать для них, когда они захотят, программируют один раз и используют на всю жизнь :).
Вы также можете смоделировать процесс с помощью JavaScript. В этой статье мы рассмотрим, как мы можем имитировать щелчок мышью с помощью JavaScript.
Поэтому возникает вопрос, как мы можем смоделировать это с помощью JavaScript, поэтому в основном мы собираемся использовать MouseEvent
конструктор JavaScript, если вы не знаете, что делает MouseEvent
, вы увидите это в действии в этой статье.
MouseEvent
MouseEvent
interface представляет события, происходящие из-за взаимодействия пользователя с указывающим устройством (например, с мышью). Общие события, использующие этот интерфейс, включают click
, dblclick
, mouseup
, mousedown
.
Узнайте больше о MouseEvent
.
Конструктор MouseEvent
поддерживает несколько совместимостей с браузерами, поэтому вы можете использовать его для любого браузера, который хотите.
MouseEvent
Конструктор в действии
Давайте инициируем событие щелчка мыши с помощью конструктора MouseEvent
.
Ниже приведен код:
document.body.addEventListener('click', () => { name = prompt("Enter you name"); console.log(name); }); const simulate = new MouseEvent('click', { view: window, bubbles: true, cancelable: true, clientX: 100, }); document.body.dispatchEvent(simulate);
Давайте разберем код построчно, чтобы лучше понять, что здесь происходит.
Мы добавили событие щелчка на document.body
с помощью метода addEventListener
, и внутри нашей функции обратного вызова мы вызываем функцию prompt
, а затем печатаем переменную name
.
Затем мы вызвали функцию MouseEvent
и передали первый аргумент как click
в качестве первого аргумента, чтобы установить тип события мыши.
Второй аргумент, который мы передали, — это объект, который устанавливает некоторые свойства, чтобы заставить работать событие мыши.
view
установлен на window
, чтобы мы могли инициировать событие click для элемента в пределах window
.
bubbles
устанавливается на true
, чтобы он распространялся от дочернего родителя.
clientX
— координата x щелчка мышью по документу.
Затем мы вызываем document.body.dispatchEvent
, чтобы инициировать событие click для элемента body.
Теперь, когда запускается dispatch
, мы увидим, что в окне появляется приглашение и запрашивается ваше имя, и когда вы вводите свое имя в приглашении и нажимаете ввод, вы увидите, что ваше имя появляется имя console
.
Вы можете подписаться на меня на следующих платформах: Мой личный блог-сайт: Клуб программистов-гиков, Моя страница в Facebook: Клуб программистов-гиков Мой канал в телеграмме: Клуб программистов-гиков, Моя учетная запись в Твиттере: Kuldeep Singh , Мой канал на Youtube: Клуб программистов.