Я работаю над сайтом, который предоставляет пользователю котировки и бронирование для аренды оборудования. Если пользователь проходит через несколько шагов и решает закрыть браузер или уйти, прежде чем закончить, тогда клиент хотел бы предложить специальную сделку. Клиент хотел бы запретить закрытие окна и запросить у них номер телефона, чтобы они могли звонить им по более выгодному тарифу, если он станет доступен.
Я могу предотвратить закрытие окна и запретить браузеру отключаться. Когда это происходит, отображается div с небольшим для пользователя, чтобы отправить и возможность пойти дальше и закрыть окно. Это все отлично работает. Проблема в том, что если пользователь обновляет страницу или нажимает кнопки «назад» или «вперед», действие блокируется так же, как если бы пользователь закрывал браузер. Но мне все равно, пойдут ли они вперед или назад или обновят страницу, потому что это означает, что они все еще находятся в процессе бронирования. К сожалению, я не могу различить два типа событий.
Я присоединяю функцию к событию onbeforeunload, чтобы вызвать сообщение для пользователя. Сайт, над которым я работаю, - это сайт ASP.NET, если это кому-нибудь пригодится.
Вот код, который я использую. Элементы divSecondClose и divThankYou настроены на отображение: ни один при первой загрузке страницы. <% = DisplayThankYou%> устанавливается на «истина» после отправки формы, поэтому появляется сообщение с благодарностью.
var showSecondCloseOnExit = true;
var displayThankyou = '<%=DisplayThankYou %>';
if (displayThankyou == true)
{
var divSecondClose = document.getElementById('divSecondClose');
divSecondClose.style.display = '';
var divThankYou = document.getElementById('divThankYou');
divThankYou.style.display = '';
showSecondCloseOnExit = false;
}
else
{
addListener(window, 'beforeunload', CloseWindowEvent, false);
var allLinks = document.getElementsByTagName('a');
for (var linkIndex = 0; linkIndex < allLinks.length; linkIndex++)
{
addListener(allLinks[linkIndex], 'click', function(){showSecondCloseOnExit = false;}, false);
}
}
function CloseWindowEvent(e) {
if(!e) e = window.event;
if (showSecondCloseOnExit)
{
var divSecondClose = document.getElementById('divSecondClose');
divSecondClose.style.display = '';
showSecondCloseOnExit = false;
//e.cancelBubble is supported by IE - this will kill the bubbling process.
e.cancelBubble = true;
e.returnValue = 'RATE CHANGE NOTIFICATION\nWould you take a moment before you leave to help us serve you better?';
//e.stopPropagation works in Firefox.
if (e.stopPropagation) {
e.stopPropagation();
e.preventDefault();
}
}
}