Для организации своей системы навигации по сайту очень удобно использовать hash-часть адреса (расположенную после "#"). Если из JavaScript изменять значение location.hash простым присваиванием (кстати, location.hash содержит не только все то, что расположено после символа "#", но и его самого), то каждое изменение будет запоминаться браузером и использоваться, например, при нажатии кнопки "Назад". Такое поведение не всегда удобно, т.к. пользователь может ожидать, что при нажатии "Назад" он вернется на предыдущую страницу, а не будет гулять по всей истории своих hash-переходов в пределах данной страницы. В таком случае необходимо не менять hash-часть не непосредственно, а использовать метод location.replace():
location.replace(location.protocol+"//"+location.host+location.pathname+location.search+"#"+newHashValue);
Такое изменение не вызовет перезагрузки страницы, т.к. изменилась только hash-часть адреса, а также не будет сохранено в истории браузера (точнее в истории браузера предыдущий адрес будет заменен на новый).
Спасибо за статью. Я тоже рассматривал этот вопрос: http://plutov.by/post/html5_history_api
ОтветитьУдалитьДа, спасибо. Помогло для http://eltekospb.ru
ОтветитьУдалитьУ меня вот обратная ситуация. На странице есть меню ссылок вида #part-1, #part-2 - т.е. навигация в пределах страницы. Я реализую плавный скроллинг + остановку не в том месте, где элемент впритык к верхней границе окна, а с отступом от верха. Но вот задача: если меняю hash, браузер жёстко скроллит к элементу и ломает замысел, зато идёт запись в историю, и можно вернуться к меню кнопкой "назад". А если не трогаю hash, то кнопка "назад" возвращает не к меню, а на предыдущую страницу. Как разрешить браузер писать в историю, но не реагировать на смену hash?
ОтветитьУдалитьРазобрался сам, помогу другим. Надо сделать:
ОтветитьУдалитьtry { history.pushState( null, null ); } catch(e) {}
Перед тем, как начинать плавно скроллить. Тогда браузер сохранит текущую позицию в истории