Как изменить URL-адрес без обновления страницы?
Я создал сайт с CodeIginer, и я хочу реализовать AJAX и JQuery на одной из моих страниц. Проблема в; при загрузке содержимого URL-адрес не изменяется.
Скажем, что у меня есть URL http://www.example.com/controller/function/param
И еще один URL: http://www.example.com/controller/function/param2
Как я могу изменить первый URL-адрес на второй, когда я нажимаю кнопку?
В HTML5 вы можете изменить URL-адрес:
window.history.pushState("object or string", "Title", "/new-url");
проверить http://spoiledmilk.com/blog/html5-changing-the-browser-url-without-refreshing-page/
docs: https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history#The_pushState().c2.a0method
UPDATE
Обзор того, какой браузер поддерживает новый API истории HTML5:
http://caniuse.com/#search=pushState (caniuse.com стоит закладок!)
уже есть фреймворки, которые делают тяжелую работу для вас и даже изящно относятся к общему решению хэш-тегов:
History.js изящно поддерживает API-интерфейс истории/состояния HTML5 (pushState, replaceState, onPopState) во всех браузерах. В том числе постоянная поддержка данных, заголовков, replaceState. Поддерживает jQuery, MooTools и Prototype. Для браузеров HTML5 это означает, что вы можете изменить URL-адрес напрямую, без необходимости использовать хеши. Для HTML4-браузеры вернутся к использованию старого onhashchange функциональность.
Структура базовых баз для приложений с тяжелым предоставление моделей с привязкой ключевого значения и пользовательскими событиями, коллекциями с богатым API перечислимых функций, представления с декларативным событием обработки и подключает все это к вашему существующему приложению поверх Интерфейс RESTful JSON.... Поддержка pushState существует на основе чисто выборки в Backbone. Старые браузеры, которые не поддерживают pushState, будут продолжать использовать хэш-фрагменты URL-адреса, и если URL-адрес хэша посещают pushState-browser, он будет прозрачно обновлен до истинного URL.
MooTools - это компактная модульная объектно-ориентированная инфраструктура JavaScript, разработанная для продвинутого разработчика JavaScript. [...] Управление историей через popstate или hashchange. Заменяет URL страницы без перезагрузки и возвращается к Hashchange на старших браузеры.
dojo экономит ваше время и масштабы с помощью вашего процесса разработки, используя веб-стандарты как его платформы. Его инструментарий опытных разработчиков обращается к созданию высоких качественные настольные и мобильные веб-приложения. [...] dojox.app управлять навигацией историю через стандарт HTML5 pushState и делегировать его браузеру управление историей.
... просто чтобы назвать несколько.
(!!) БУДЬТЕ ЗНАКОМ
Один важный побочный эффект при использовании pushState (цитата из документации на базовую станцию ):
Обратите внимание, что использование реальных URL-адресов требует, чтобы ваш веб-сервер мог правильно отрисуйте эти страницы, поэтому необходимы дополнительные изменения в качестве Что ж. Например, если у вас есть маршрут/документы/100, ваша сеть сервер должен иметь возможность обслуживать эту страницу, если браузер посещает этот URL-адрес непосредственно. Для полной полномасштабной поисковой работы лучше всего иметь сервер генерирует полный HTML-код для страницы... но если это веб-сайт приложения, просто предоставив тот же контент, который у вас был бы для URL-адрес корня и заполнение остальных с помощью Backbone Views и JavaScript отлично работает.
Можно использовать хэш (#) и поместить все, что захотите.
Здесь сайт, который я построил с помощью этого, - и затем у меня есть JavaScript, читающий хэш и вызывающий соответствующие функции:
http://bannerhouse.com.au/#/popup=media&id=don
Боковое примечание:
Это полезно для флеш-сайтов или флэш-контента; вы можете использовать FlashVars для синтаксического анализа хэш-значения для SWF и загрузки соответствующего раздела/экрана на основе этого.
Используйте хэш-теги через Javascript, поэтому в обработчике событий нажатия кнопки:
location.hash = "param2"
Что изменится http://example.com/mypage/#whatever
в
http://example.com/mypage/#param2
Конечно, вы также можете поместить свои "папки" после хэширования, поэтому с базовым url http://example.com/ вы затем добавляете:
location.hash = "/MyPage/MySubPage/MyInfo";
который меняет его на http://example.com/#/MyPage/MySubPage/MyInfo
A подобный поток вывел no, если не использовать хэш-тег.
Одна идея, выдвинутая, но сильно обескураженная, использовала ответ HTTP HTTP.
Из W3:
Нет ответа 204
Сервер получил запрос, но нет никакой информации для отправки назад, и клиент должен оставаться в том же вид документа. Это в основном позволяет вход для скриптов без изменения документ в то же время.