Блог

Я не могу понять, как удалить сообщение об ошибке проверки после того, как пользователь закрыл всплывающее окно (сообщение об ошибке проверки исчезает, если пользователь вводит правильные значения в поля ввода и нажимает «Отправить», но если пользователь закрывает всплывающее окно после появления ошибки проверки, ошибка проверки сохранится даже при повторном открытии всплывающего окна пользователем).

Код, который я использую для проверки:

 enableValidation ({  formSelector: '.edit-form',  inputSelector: '.popup__input',  submitButtonSelector: '.popup__submit-button',   inactiveButtonClass: 'popup__button-disabled',   inputErrorClass: 'popup__input_error',  spanErrorClass: 'popup__error_visible', });  function displayInputError (formElement, inputElement, errorMessage, {inputErrorClass, spanErrorClass}) {  const errorElement = formElement.querySelector(`.${inputElement.id}-error`);  inputElement.classList.add(inputErrorClass);  errorElement.textContent = errorMessage;  errorElement.classList.add(spanErrorClass );  };   function hideInputError (formElement, inputElement, {inputErrorClass, spanErrorClass}) {  const errorElement = formElement.querySelector(`.${inputElement.id}-error`);  inputElement.classList.remove(inputErrorClass);  errorElement.classList.remove(spanErrorClass);  errorElement.textContent = ' '; };  function isValid (formElement, inputElement, rest) {  if (!inputElement.validity.valid amp;amp; (!inputElement.validity.valueMissing || validateEmpty)) {  displayInputError (formElement, inputElement, inputElement.validationMessage, rest);  } else {  hideInputError (formElement, inputElement, rest);  } };   function setEventListeners (formElement, selectors) {  const inputList = Array.from(formElement.querySelectorAll(selectors.inputSelector));  inputList.forEach((inputElement) =gt; {  inputElement.addEventListener('input', function () {  isValid(formElement, inputElement, selectors);  updateSubmitStatus(formElement, selectors);  });  }); };   function enableValidation ({formSelector, ...rest}) {  const formList = Array.from(document.querySelectorAll(formSelector));  formList.forEach((formElement) =gt; {  formElement.addEventListener('submit', (evt) =gt; {  evt.preventDefault();  });  setEventListeners(formElement, rest);  }); };   function hasInvalidInput (inputList) {  return inputList.some((inputElement) =gt; {  return !inputElement.validity.valid;  }); };   function updateSubmitStatus (formElement, {inputSelector, submitButtonSelector, inactiveButtonClass}) {  const inputList = Array.from(formElement.querySelectorAll(inputSelector));  const buttonElement = formElement.querySelector(submitButtonSelector);  if (hasInvalidInput(inputList)) {  buttonElement.disabled = true;  buttonElement.classList.add(inactiveButtonClass);  } else {  buttonElement.disabled = false;  buttonElement.classList.remove(inactiveButtonClass);  } };  

У меня есть предчувствие, что мне нужно записать часть кода hideInputError в свою функцию, которая либо открывает, либо закрывает всплывающие окна, чтобы очистить сообщения об ошибках, но ничего из того, что я пробовал до сих пор, не сработало.

 const openPopup = function (popup) {  popup.classList.add('popup_opened');  document.addEventListener('keydown', closeOnEscape); //Close popups through 'Escape' key };  //Close Popup const closePopup = function (popup) {  popup.classList.remove('popup_opened'); };  

Но когда я попытался запустить функции isValid() или hideInputError() внутри функций openPopup или closePopup, сообщения об ошибках остались. (Поле ввода и интервал, который я использовал для отображения сообщения об ошибке, сохраняют класс, который я использую для отображения сообщения об ошибке после повторного открытия всплывающего окна [и неудачной отправки]).

Примечание: это чистая валидация переднего плана. Ничего не отправляется на сервер. Проверка выполняется с помощью HTML и JS.