- 13, May 2024
- #1
Привет, ребята,
Я не специалист по Javascript, поэтому мне нужна помощь в следующем.
У меня есть всплывающее окно с просьбой ввести адрес электронной почты.
Прямо сейчас всплывающее окно просто закрывается после отправки, что не очень приятно для пользователя.
В идеале текстовая панель и кнопка отправки исчезнут и будут заменены коротким комментарием, например «Спасибо, мы свяжемся с вами». Кроме того, я бы хотел, чтобы всплывающее окно закрывалось автоматически через N секунд после отправки.
Вот коды:
HTML:
У меня есть всплывающее окно с просьбой ввести адрес электронной почты.
Прямо сейчас всплывающее окно просто закрывается после отправки, что не очень приятно для пользователя.
В идеале текстовая панель и кнопка отправки исчезнут и будут заменены коротким комментарием, например «Спасибо, мы свяжемся с вами». Кроме того, я бы хотел, чтобы всплывающее окно закрывалось автоматически через N секунд после отправки.
Вот коды:
HTML:
var self = this;
var showDelay = parseInt('[[ bannerShowDelayInMilliseconds ]]' || '0', 10);
setTimeout(function () {
requestAnimationFrame(function () {
if (!self.inPreview && "true" == "{{ 'true' if customer.email else 'false' }}") {
return;
}
self.sdk.track('banner', getEventProperties('show', false));
document.body.insertAdjacentHTML('beforeend', self.html);
var banner = self.banner = document.querySelector('.subscription-dialog');
self.backdrop = document.querySelector('.subscription-dialog + .banner-backdrop');
banner.insertAdjacentHTML('afterbegin', '<style>' + self.style + '</style>');
var form = banner.querySelector('form');
form.onsubmit = function () {
var eventProperties = getEventProperties('subscribe');
var email = (form.email.value || '').toLowerCase();
eventProperties.subscription_email = email;
self.sdk.track('banner', eventProperties);
if (validateEmail(email)) {
self.sdk.update({
email: email
});
removeBanner();
}
return false;
};
var btnClose = banner.querySelector('.close');
btnClose.onclick = function () {
removeBanner();
self.sdk.track('banner', getEventProperties('close'));
};
});
}, showDelay);
function getEventProperties(action, interactive) {
return {
action: action,
banner_id: self.data.banner_id,
banner_name: self.data.banner_name,
banner_type: self.data.banner_type,
variant_id: self.data.variant_id,
variant_name: self.data.variant_name,
interaction: interactive !== false ? true : false,
location: window.location.href,
path: window.location.pathname
};
}
function removeBanner() {
if (self.banner) {
self.banner.parentNode.removeChild(self.banner);
}
if (self.backdrop) {
self.backdrop.parentNode.removeChild(self.backdrop);
}
}
function validateEmail(email) {
return email && /^\S+@\S+\.\S+$/.test(email);
}
return {
remove: removeBanner
};
[/code/ <div class="banner subscription-dialog"> <span class="header">[[ headerText ]]</span> <span class="text">[[ bodyText ]]</span> <form> <input name="email" type="text" class="input" placeholder="электронная почта@example.com" pattern="^\S+@\S+\.\S+$" title="адрес электронной почты в формате «[email protected]»"> <input type="submit" class="button" value="[[ buttonTitle ]]" /> </form> <span class="lose"><span class="close-cross"></span></span> </div> <div class="banner-backdrop"></div> 
![[ИРСОТ: Бугаев Леонид] Связи решают все: Нетворкинг на практике](/assets/images/icons/forum1.png){kind=icon}
![[Елена Блиновская] Марафон «Отношения » (2019)](/assets/images/icons/forum4.png){kind=icon}
![[Том Батлер-Боудон] 50 великих книг по психологии (аудиокнига)](/assets/images/icons/forum3.png){kind=icon}
