Блог

В приведенном ниже фрагменте кода, если вы нажмете на кнопку Один, скрипт прослушает этот щелчок, и если вы находитесь в браузере Chrome, скрипт программно нажмет на кнопку Два, а затем передаст сообщение на консоль. Все это работает.

При каждом нажатии на кнопку One я вижу, что каждое сообщение консоли удваивается по сравнению с предыдущим… Это почти так же, как если бы нажатие на кнопку Один увеличивало количество нажатий на кнопку Два.

Этот вопрос состоит из двух частей:

Почему при первом нажатии на кнопку One не возвращается ни одно консольное сообщение?

Как мне нажать на кнопку Один и заставить ее вернуть только один щелчок по кнопке два?

 let chromeCheck = /Chrome/.test(navigator.userAgent) amp;amp; /Google Inc/.test(navigator.vendor);  one.addEventListener('click', function() {  if (chromeCheck) {  (function playVideo() {  document.getElementById('two').click();  two.addEventListener('click', function() {  console.log('Button two was clicked');  })  })();   } else {  console.log('Button two was not clicked.')  } }) 

 lt;button class="button" id="one"gt;Button Onelt;/buttongt; lt;button class="button" id="two"gt;Button Twolt;/buttongt; 

Ты немного перепутал свой заказ. Прежде всего, вы нажимаете кнопку, программно before добавляя прослушиватель событий во вторую кнопку. Таким образом, вы не получите журнал консоли при первом же щелчке. Во-вторых, вы прикрепляете прослушиватель событий к кнопке два при every нажатии кнопки один. Поэтому каждый раз, когда вы нажимаете кнопку один, к кнопке два будет прикреплен другой журнал консоли. Чтобы избежать этого, просто добавьте прослушиватель событий для кнопки два за пределами прослушивателя щелчков для кнопки один.

 let chromeCheck = /Chrome/.test(navigator.userAgent) amp;amp; /Google Inc/.test(navigator.vendor);   if (chromeCheck) {  two.addEventListener('click', function() {  console.log('Button two was clicked');  }) }  one.addEventListener('click', function() {  if (chromeCheck) {  document.getElementById('two').click();  } else {  console.log('Button two was not clicked.')  } }) 

 lt;button class="button" id="one"gt;Button Onelt;/buttongt; lt;button class="button" id="two"gt;Button Twolt;/buttongt;