Почему модальное окно всплывает только при втором клике на кнопку?

Рейтинг: 0Ответов: 1Опубликовано: 29.03.2023

Есть несколько кнопок, которые должны вызывать модальное окно. Каждая из них выглядит так

<a href="#" class="btn nav__btn" data-back="Click me" data-front="Get started" onclick="popup(this)"></a>

код

function popup(event)
{
    event.addEventListener('click', function(e){      
      e.preventDefault();
      popUp.classList.add('active');
      
      
      // чтобы закрывалось окно при нажатии на черное
      popUp.addEventListener('click', function(){
        popUp.classList.remove('active');
        
          
      }) 
      const closePopUp = document.getElementById('closePopUp');
      closePopUp.addEventListener('click', () => {
        popUp.classList.remove('active');
      } )
    })
}
javascript modal popup
Источник: Stack Overflow на русском

Ответы

▲ 0Принят
<a href="#" class="btn nav__btn" data-back="Click me" data-front="Get started" onclick="popup()"></a>

function popup()
{
      popUp.classList.add('active');
      return false;
}

// чтобы закрывалось окно при нажатии на черное
popUp.addEventListener('click', function(){
    popUp.classList.remove('active');
});
const closePopUp = document.getElementById('closePopUp');
closePopUp.addEventListener('click', () => {
    popUp.classList.remove('active');
});