Contact form 7 хук mailsent, у скрипта 7 пятниц на неделе, в чем ошибка?

Question

[alexiusgrey]

На сайте несколько форм, и после отправки одной из них должен вылетать один поп-ап,а после всех остальных другой.
Поп-апы свои, без плагинов.
То все нормально, оба поп-апа появляются при отправке, то опять поп-ап не появляется при отправке формы, в консоли ошибка main.js:350 Uncaught TypeError: Cannot read properties of null (reading 'addEventListener')

Сам скрипт

var ankForm = document.querySelector( 'main#anketa' );
var fForm =  document.querySelector( 'section.questions-blue, section.contact-form-big, footer');
var element = document.querySelector(".response-popup");  
var felement = document.querySelector(".response-popup-footer");  

ankForm.addEventListener( 'wpcf7mailsent', function( event ) {
  element.classList.add("popup-visible");
}, false );

fForm.addEventListener( 'wpcf7mailsent', function( event ) {
   felement.classList.add("popup-visible");
}, false );

Какая ошибка? Хук правильный, брал пример из интернета, только селекторы заменил на свои.

Answer 1

[Stanislav K]

Похоже, что querySelector не может найти указанный элемент, в связи с чем addEventListener не прикрепляется к нему. Добавьте проверки на существование элементов ankForm, fForm и проверьте правильно ли они находятся в querySelector.

И заверните все в window.onload или $(document).ready, вам нужно обращаться к элементам после полной готовности страницы