Здравствуйте! Суть была в том, чтобы при клике на ссылку, менялся контент без перезагрузки. Но проблема в том, что когда на первой странице кликаешь на третью ссылку, контент меняется, все работает, но вот со второй странице при переходе обратно, на первую, странице перезагружается. Что не так?
Есть вот такой код:
Структура первой страницы
<div id="content">
Текст текст текст
<nav id="navigation">
<ul>
<li><a href="1.html">1</a></li>
<li><a href="2.html">2</a></li>
<li><a class="togo" href="/en/index.html">3</a></li>
</ul>
</nav>
</div>
Структурай второй страницы
<div id="content">
Текст текст текст
<nav id="navigation">
<ul>
<li><a href="1.html">1</a></li>
<li><a href="2.html">2</a></li>
<li><a class="togo" href="../index.html">3</a></li>
</ul>
</nav>
</div>
$('document').ready(function(){
$('.togo').on('click', function(e){
// отменяем стандартное действие при клике
e.preventDefault();
// Получаем адрес страницы
var href = $(this).attr('href');
// Передаем адрес страницы в функцию
getContent(href, true);
});
});
// Добавляем обработчик события popstate,
// происходящего при нажатии на кнопку назад/вперед в браузере
window.addEventListener("popstate", function(e) {
// Передаем текущий URL
getContent(location.pathname, false);
});
// Функция загрузки контента
function getContent(url, addEntry) {
$.get(url).done(function(data) {
// Обновление только текстового содержимого в сером блоке
$('#content').html($(data).find("#content").html());
// Если был выполнен клик в меню - добавляем запись в стек истории сеанса
// Если была нажата кнопка назад/вперед, добавлять записи в историю не надо
if(addEntry == true) {
// Добавляем запись в историю, используя pushState
history.pushState(null, null, url);
}
});
}
Вот что еще заметил, если перейти на вторую страницу и обновить страницу, то при переходе на главную все ок, а обратно на вторую перезагрузка. обратный эффект получается
Простой