Как узнать, как включить кнопку возврата в приложении jQuery AJAX?

Question

Я рассмотрел все самые популярные вопросы здесь, в том числе те, которые ссылаются на самые популярные плагины, такие как BBQ и jQuery Address.

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

Я хочу сделать четыре вещи:

1) Сделайте так, чтобы кнопка «вперед» работала так же, как в приложении без AJAX.
2) Сделайте так, чтобы кнопка «назад» работала так же, как в приложении без AJAX.
3) Отразите URL в адресной строке, чтобы его можно было добавить в закладки.
4) Создайте глубокие ссылки, чтобы можно было сканировать материалы AJAX.

И это все. Все остальное излишне. Это приложение на Rails 3.0.4, и у меня есть ссылки, которые имеют ссылку "#". Нажатие на одну из ссылок активирует функцию из application.js, которая заменяет html в div на текущей странице на большее количество ссылок, созданных из части, которая отображается из файла .js.erb.

У меня есть крошка, которая отлично работает, но с помощью кнопки «Назад» вы попадете на любой веб-сайт, на который вы смотрели, прежде чем вы посмотрели приложение.

Итак, некоторые из моих вопросов:

1) Нужно ли каждой из моих ссылок уникальное значение href вместо простого "#"?
2) Должен ли я каждый раз заменять этот div или просто скрывать его и создавать новый? Если да, должен ли каждый новый div иметь новый идентификатор?
3) Поскольку в настоящее время URL-адрес в адресной строке не изменяется, и все эти AJAX-запросы являются ПОСТАМИ, нужно ли мне что-то делать в Rails, чтобы он отвечал на один из этих новых URL-адресов, который неизменно будет вызывать GET-запрос при обращении к нему через историю браузера или кнопку назад?

Это барьеры, которые мешают мне ответить на существующие вопросы. Большое спасибо за любую помощь, которую вы можете предложить!

EDIT:

Мое приложение не основано на вкладках. Не все якоря доступны при загрузке страницы. Вот что происходит, когда пользователь нажимает на ссылку:

1) Поле в скрытой форме заполняется текстовым значением ссылки, по которой щелкнули.

2) Скрытая форма сериализуется и доставляется в действие контроллера с помощью POST.

3) Действие контроллера определяет, кто сделал запрос, выясняет, к каким данным они имеют доступ, и использует значения формы (теперь параметры) для получения списка объектов.

4) Эти объекты передаются в шаблон представления .js.erb, который, в свою очередь, отображает частичное с переданными значениями.

5) Новые ссылки возвращаются через js в шаблоне .js.erb.

По сути, поскольку мои данные не являются статичными, мне нужно выяснить, как заново сгенерировать этот запрос POST с состоянием форм КАК ЭТО БЫЛО, чтобы действительно "вернуться". Или может состояние формы и экран как-то кешироваться?

Answer 1

1) Нужно ли каждой из моих ссылок уникальное значение href вместо простого "#"?

Да, браузер обнаруживает только изменения в URL. если текущим URL-адресом является foo.com/#, а пользователь щелкает ссылку, по которой он переходит на foo.com/#, как же история должна знать, что он куда-то ходил?

Итак, вы ставите уникальный текст после #. foo.com/#home и foo.com/#about будут генерировать уникальные записи истории. Затем, когда пользователь добавляет в закладки один из них, вы можете проанализировать последнюю часть URL-адреса, чтобы выяснить, где он находился.

2) Скрыть и поменять местами div или заменить?

Вы сэкономите на трафике, если не будете каждый раз загружать содержимое каждого раздела. Если содержимое достаточно маленькое, поместите все это на странице и просто скрыть / показать элементы div. Если содержание большое, извлекайте его только при первом нажатии на него. то есть я нахожусь на A и нажимаю на B, вы должны скрыть A и сделать ajax-запрос, чтобы получить содержимое B, затем показать B. Затем, если я вернусь к A, вы покажете A, который уже существует, и скроете B. Нет необходимости сделать еще один запрос к серверу, чтобы получить A, когда он у вас уже есть.

3) Поскольку в настоящее время URL-адрес в адресной строке не изменяется, и все эти запросы AJAX являются ПОСТАМИ, нужно ли мне что-либо делать в Rails, чтобы он отвечал на один из этих новых URL-адресов, который неизменно вызывает GET запросить доступ через историю браузера или кнопку назад?

Новые URL не будут вызывать GET-запрос при каждом использовании кнопки «Назад». Удобство стиля # состоит в том, что что-либо после # не отправляется на сервер. то есть, если вы перейдете на страницу foo.com/bar.html#home, клиент отправит запрос GET на страницу foo.com/bar.html. Затем, если пользователь переходит на foo.com/bar.html#about, браузер не выполняет другого запроса самостоятельно. Первоначально # был там для обозначения ссылок на контент на той же странице (то есть большой документ, где вы можете захотеть иметь индекс, который ссылается на начало каждой главы).

Answer 2

В основном, включив трюк с кнопкой «Назад» в приложениях ajax, он использует метод хэширования в URL, например, если вы находитесь в www.myurl.com, когда вы делаете запрос ajax и хотите показать другую страницу или другую область, вы будете выполнять свои действия. и измените URL на www.myurl.com#myaction

для получения дополнительной информации есть скринкаст от remy sharp, вы должны проверить его Включение кнопки