jQuery.mobile.navigate() — jQuery Mobile

jQuery.mobile.navigate( url [, data ] )Возвращает: Undefinedверсия добавлена: 1.3

Описание: Изменение URL и отслеживание истории. Работает в браузерах как с новой API истории, так и без неё.

jQuery.mobile.navigate( url [, data ] )
- url
  
  Тип: Строка
- data
  
  Тип: Объект

Метод $.mobile.navigate предоставляет унифицированный API для манипулирования историей в браузерах, которые поддерживают новую API истории, и тех, которые нет (hashchange). Он работает совместно с событием navigate, храня и извлекая произвольные данные, связанные с URL (подобно popState и replaceState). Когда пользователь возвращается к URL, заданному методом navigate, срабатывает событие navigate с ассоциированными данными.

Примечание: Этот метод — вспомогательная функция низкого уровня, которая может использоваться самостоятельно. Если вы используете фреймворк навигации jQuery Mobile, не следует использовать эту функцию отдельно. Вместо этого используйте методы pagecontainer для перехода на другую страницу.

Примеры:

Дважды измените фрагмент хэша, а затем выведите данные, предоставленные событием navigate, когда браузер перемещается назад по истории.

// Starting at http://example.com/
 
// Alter the URL: http://example.com/ => http://example.com/#foo
$.mobile.navigate( "#foo", { info: "info about the #foo hash" });
 
// Alter the URL: http://example.com/#foo => http://example.com/#bar
$.mobile.navigate( "#bar" );
 
// Bind to the navigate event
$( window ).on( "navigate", function( event, data ) {
  console.log( data.state.info );
  console.log( data.state.direction )
  console.log( data.state.url )
  console.log( data.state.hash )
});
 
// Alter the URL: http://example.com/#bar => http://example.com/#foo
window.history.back();
 
// From the `navigate` binding on the window, console output:
// => "info about the #foo hash"
// => "back"
// => "http://example.com/#bar
// => "#bar"

Перехватите щелчок по ссылке, чтобы использовать метод navigate, а затем загрузить содержимое.

// Starting at http://example.com/
 
// Define a click binding for all anchors in the page
$( "a" ).on( "click", function( event ) {
 
  // Prevent the usual navigation behavior
  event.preventDefault();
 
  // Alter the url according to the anchor's href attribute, and
  // store the data-foo attribute information with the url
  $.mobile.navigate( this.attr( "href" ), { foo: this.attr( "data-foo" ) });
 
  // Hypothetical content alteration based on the url. E.g, make
  // an ajax request for JSON data and render a template into the page.
  alterContent( this.attr( "href" ) );
});