Кто-нибудь смог получить jQuery UI Tabs 3 (Последняя версия), работая с кнопкой "Назад"?
Я имею в виду, что если пользователь нажимает кнопку "Назад", они должны перейти на ранее посещенную вкладку на странице, а не на другую страницу.
Включение в историю звуков похоже на то, что он может работать, но я не могу заставить его работать с ajax загруженные вкладки.
Если кто-то сумел сделать эту работу, он был бы глубоко оценен, спасибо!
Я тоже столкнулся с этим. Его очень легко с плагином адресов jquery здесь http://www.asual.com/jquery/address/
Демонстрация для вкладок показалась немного сложной. Я просто сделал это:
$('document').ready(function() {
// For forward and back
$.address.change(function(event){
$("#tabs").tabs( "select" , window.location.hash )
})
// when the tab is selected update the url with the hash
$("#tabs").bind("tabsselect", function(event, ui) {
window.location.hash = ui.tab.hash;
})
});
Я бы предложил взглянуть на это: http://www.asual.com/jquery/address/ позволяет глубже связываться с вашими вызовами AJAX.
Обновление. Решение, которое я разместил, не устраняет проблему, которую я описал. ^^ будет публиковать снова, если я помню, когда я ее разрешу. Update2: Я сейчас "решил" проблему (см. Ниже).
Вопрос немного устарел, но если кто-то споткнется на этот вопрос, как и я, быстрое изменение этого решения Джастином Хамаде может помочь некоторым людям.
Если вы используете JQuery Address 'externalChange, а не просто "change", это предотвращает отправку лишнего запроса (в моем случае это приводит к ошибке в консоли javascript). Это связано с тем, что если кто-то нажимает на вкладку, адрес изменяется сам по себе (благодаря jquery ui), thsi меняет триггеры $.address.change один раз, который выбирает вкладку, хотя jquery-ui уже сделал это... По крайней мере, я подумайте, что происходит.
Также мне не нравились вкладки, создающие хэши, такие как "# ui-tab-2", "# ui-tab-3" и т.д., поэтому я использовал следующий код, который заставляет URL использовать имена элементов привязки как хешей (например, "www.example.com # cool_stuff" вместо "www.example.com # ui-tab-2" ):
$(function() {
$( "#tabs" ).tabs({
cache: false,
});
// For forward and back
$.address.externalChange(function(event){
var name = window.location.hash != "" ? window.location.hash.split("#")[2] : ""
$("#tabs").tabs( "select" , $("#tabs a[name="+ name + "]").attr('href') )
});
// when the tab is selected update the url with the hash
$("#tabs").bind("tabsselect", function(event, ui) {
$.address.hash(ui.tab.name);
});
});
Тем не менее, A) Я новичок в jquery и не уверен, что это эффективно/безопасно/ "Правильный способ сделать это" и B) Обязательно используйте это, только если вы можете быть уверены, что атрибут name анкеров не имеет никаких символов, которые не являются безопасными для URI (т.е. пространства).
Update2: я сейчас "решил" проблему в Update1, но у нее ужасно уродливая строка:
var name = window.location.hash != "" ? window.location.hash.split("#")[2] : ""
Потому что, по-видимому, функция $.address.hash(val) добавляет "/#" после первого хэша, но если мы не используем $.address.hash(val), тогда запускается внешнее изменение (по окну. location.hash = значение)
Похоже, что поддержка кнопок с обратной связью в настоящее время не встроена в вкладки пользовательского интерфейса jQuery: http://jqueryui.com/demos/tabs/#Back_button_and_bookmarking
Я использую этот плагин: http://flowplayer.org/tools/demos/tabs/ajax-history.htm
Этот jQuery История/Удаленный плагин. Создатели плагинов Tabs и History/Remote - это один и тот же человек, и они работают вместе здесь.