0

Почему при клике на button, textContent у $alertApp появляется и тут же исчезает?

var $formApp = document.querySelector('form');
var $inputApp = document.querySelectorAll('input');
var $buttonApp = document.querySelector('button');
var $alertApp = document.querySelector('.alert');

// $alertApp.style.display = 'none';

var dataBase = {
    email: '[email protected]',
    pass: '1234e1234e'
};

$buttonApp.addEventListener('click', function(){
    if($inputApp[0].value !== '' && $inputApp[1].value !== ''){
        
        if($inputApp[0].value === dataBase.email && $inputApp[1] === dataBase.pass){
            $formApp.style.display = 'none';
            console.log('Вы вошли!');
        } else {
            console.log('Вы ввели неверные данные!');
        }

    } else {
        $alertApp.style.display = 'block';
        $alertApp.textContent = 'Вы заполнили не все поля!';
    }
});
<form action="">
        <p class='alert'>Лул</p>
        <input type="text">
        <input type="text">
        <button>Go</button>
      </form>

0

1 ответ 1

0

Потому что у кнопки по умолчанию тип - submit, и Ваша страница перегружается. Сделайте

<button type="button">Go</button>

или

$buttonApp.addEventListener('click', function(evt){
  ...
  evt.preventDefault();
});

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.