Описание: есть функция с AJAX которая открывает подстраницу сайта без видимой перезагрузки сайта
async function pageUpdate(event) {
if (typeof event == 'undefined') {
$('.detoxNav[href]').click(pageUpdate);
} else {
var link = event.target.href;
event.preventDefault();
$('body').css('pointer-events', 'none');
await $('body').animate({ opacity: 0 }, 500).promise();
var html = await $.ajax(link);
var doc = new DOMParser().parseFromString(html, 'text/html');
var html = $('body', doc).html();
history.pushState(null, null, link);
$('body').html(html);
pageUpdate();
await $('body').animate({ opacity: 1 }, 500).promise();
setTimeout(function() {
$('.preloader').fadeOut('slow', function() {
$(this).remove();
});
}, 500);
$('body').css('pointer-events', '');
}
}
pageUpdate();
Проблема: Если возвращаться на страницу назад - не много подлагивает и появляется та же страница - а не прошлая
Задача: получается нужно,
- повесить обработчик на событие возврата?
- отменить его?
- загрузить прошлую страницу через AJAX?
В итоге, написал код который должен отменять событие возврата:
window.addEventListener('popstate', function(event) {
alert("STOP");
event.preventDefault();
}, false);
Но, алерт дает, а
вроде ничего не отменяет. Так ли я начал делать? В какую сторону двигаться дальше? Как это реализовать?
