2

Я использую вкладки JQuery UI, и у меня есть событие tabselect, где я использую API для загрузки и генерации JSON содержимое вкладки:Как называется событие tabselect при выборе вкладки JQuery щ программно

$('#tabs').bind('tabsselect', function(event, ui) { 
    if (ui.panel.id == "tab1") { 
    $.getJSON(...) 
    //load content of tab here 
    } 
} 

Я также использую предыстории плагин для вкладки компоновки:

$.address.change(function(event){ 
    $("#tabs").tabs("select" , hash); 
} 

Таким образом, если пользователь переходит на MYPAGE # tab1 затем tab1 загружается автоматически. Проблема заключается в том, что событие tabselect не запускается, поэтому содержимое не загружается.

Я убедился, что все это происходит после загрузки документа. Если я перейду на вкладку вручную, тогда она отлично работает, просто не при использовании вкладок («select», ...);

Есть ли какая-то опция, которую я должен включить, чтобы обычные события были запущены для программного выбора вкладки, а не щелчка по ней?

ответ

4

Согласно документации для выбора:

Выберите вкладку, как если бы она была нажата.

Это на самом деле это вызывает обработчик tabselect событий, как вы можете видеть на этом примере:

http://jsfiddle.net/andrewwhitaker/UsnNu/1/

Интересно, что это не сработает, если выбрана вкладка программно, что уже активно (в примере, если вы программно выбираете tab-1, он не запускает обработчик событий). Это может быть проблема? Или может hash содержать неправильное содержимое (т. Е. Проблема с плагином истории, который вы используете)?

Извините, я не смог дать окончательный ответ, но, надеюсь, это поможет вам отследить проблему.

+0

Он также не сработает, если вы выберите вкладку-3 и изменить код, чтобы программно выбрать вкладку-1 – Pakman

3

Попробуйте подключиться к событию шоу. Это сработало для меня, поскольку у меня была такая же проблема, когда я начал кэшировать состояния с вкладками.

$(".selector").bind("tabsshow", function(event, ui) { 
    ... 
}); 

больше информации здесь: http://jqueryui.com/demos/tabs/#event-show