Работа с веб-сайтами одной страницы и сохранение состояния с использованием хеша URL-адреса и jQuery

Я работаю над своим портфолио, делая его полностью основанным на jQuery. Поэтому моя проблема заключается в том, когда вы переходите на страницу, затем обновляетесь, и она снова приведет вас на домашнюю страницу. На самом деле у меня есть два вопроса.

  • Как вы (через jQuery/Javascript) получаете "хеш-код" из URL-адреса?
  • Как изменить URL-адрес в адресной строке при переходе на новую страницу, чтобы содержать хеш-код этой страницы?

Ответы

Ответ 1

Вы делаете опорную точку внутренней ссылкой следующим образом:

<a href="#graphicsDesign">Graphics</a>

И затем просто сделайте jQuery ответом на событие click и позвольте браузеру следовать внутренней ссылке естественным образом. Теперь браузер должен иметь внутреннюю ссылку в адресной строке. Вы можете использовать следующий JavaScript для анализа URL и затем загрузить правильную часть документа HTML. Вам нужно будет написать код, чтобы загружать правильный контент, исходя из того, что является внутренним адресом браузера.

if(window.location.hash === "graphicsDesign" ||
window.location.hash === "somethingElse") {
    loadContent(window.location.hash);
}

Ответ 4

Это не так, как обычно создаются веб-сайты, поэтому в некотором смысле вы плаваете вверх по течению. Возможно, это был более короткий путь, когда вы начали, но вы, вероятно, обнаружите, что в результате своего первоначального решения вы должны сделать гораздо больше работы.

Тем не менее, обязательно начните со всех скрытых div и затем отобразите выбранный.

Я также рекомендую плагин Cowboy BBQ, который поможет вам справиться с кнопкой возврата, а также перезагрузить: http://benalman.com/projects/jquery-bbq-plugin/