Как можно управлять последовательностью появления попапов после того, как форма отправлена в Elementor?

Как настроить закрытие оригинального всплывающего окна формы автоматически после отображения всплывающего окна с благодарностью на сайте, который использует Elementor?
  • 27 апреля 2024 г. 11:00
Ответы на вопрос 1
Для управления последовательностью появления попапов после отправки формы в Elementor, можно использовать функцию JavaScript. Например, можно назначить отображение всплывающего окна с благодарностью после успешной отправки формы через обработчик событий на кнопке отправки формы. Затем, при закрытии всплывающего окна благодарности, можно настроить отображение следующего попапа или скрыть оригинальное всплывающее окно формы.

Пример кода для отображения попапа с благодарностью после отправки формы:

```javascript
document.addEventListener( 'wpcf7mailsent', function( event ) {
    if ( 'FORM_ID' == event.detail.contactFormId ) {
        // Показать всплывающее окно с благодарностью
        document.querySelector('.thank-you-popup').style.display = 'block';
        // Закрыть оригинальное всплывающее окно формы
        document.querySelector('.original-popup').style.display = 'none';
    }
});
```

Здесь 'FORM_ID' - это идентификатор формы, для которой нужно отобразить всплывающее окно с благодарностью. '.thank-you-popup' и '.original-popup' - классы блоков с всплывающими окнами.

Чтобы автоматически закрыть оригинальное всплывающее окно формы после отображения всплывающего окна с благодарностью, можно добавить код закрытия оригинального попапа в обработчик событий всплывающего окна благодарности:

```javascript
document.querySelector('.close-thank-you-popup').addEventListener('click', function() {
    // Закрыть всплывающее окно с благодарностью
    document.querySelector('.thank-you-popup').style.display = 'none';
    // Показать оригинальное всплывающее окно формы
    document.querySelector('.original-popup').style.display = 'block';
});
```

Здесь '.close-thank-you-popup' - класс элемента кнопки закрытия всплывающего окна с благодарностью. 

Таким образом, можно управлять последовательностью появления попапов и автоматическим закрытием попапов на сайте, используя Elementor и JavaScript.
Похожие вопросы