AGGIORNAMENTO [ Sun 26/08/2012 ] Questa risposta è diventata così popolare che ho deciso di trasformarla in un vero e proprio blog / tutorial
Visita il mio blog qui per vedere le ultime informazioni di facile accesso per lavorare con le schede in jQueryUI
Incluso anche (anche nel blog) è un jsFiddle
Aggiornare! Nota: nelle versioni più recenti di jQueryUI (1.9+), ui-tabs-selected
è stato sostituito con ui-tabs-active
. !!!
So che questo thread è vecchio, ma qualcosa che non ho visto menzionato era come ottenere la "scheda selezionata" (pannello attualmente abbassato) da qualche parte diversa dagli "eventi della scheda". Ho un modo semplice ...
var curTab = $('.ui-tabs-panel:not(.ui-tabs-hide)');
E per ottenere facilmente l'indice, ovviamente c'è il modo elencato sul sito ...
var $tabs = $('#example').tabs();
var selected = $tabs.tabs('option', 'selected'); // => 0
Tuttavia, potresti usare il mio primo metodo per ottenere l'indice e tutto ciò che desideri su quel pannello abbastanza facilmente ...
var curTab = $('.ui-tabs-panel:not(.ui-tabs-hide)'),
curTabIndex = curTab.index(),
curTabID = curTab.prop("id"),
curTabCls = curTab.attr("class");
// etc ....
PS. Se utilizzi una variabile iframe e poi .find ('. Ui-tabs-panel: not (.ui-tabs-hide)'), troverai facile farlo anche per le schede selezionate nei frame. Ricorda, jQuery ha già fatto tutto il lavoro duro, non c'è bisogno di reinventare la ruota!
Solo per espandere (aggiornato)
Mi è stata posta la domanda: "E se nella visualizzazione sono presenti più aree di schede?" Ancora una volta, pensa in modo semplice, usa la mia stessa configurazione ma usa un ID per identificare le schede di cui vuoi entrare in possesso.
Ad esempio, se hai:
$('#example-1').tabs();
$('#example-2').tabs();
E vuoi il pannello corrente del secondo set di schede:
var curTabPanel = $('#example-2 .ui-tabs-panel:not(.ui-tabs-hide)');
E se vuoi la scheda EFFETTIVA e non il pannello (davvero facile, motivo per cui non l'ho menzionato prima ma suppongo che lo farò ora, solo per essere accurato)
// for page with only one set of tabs
var curTab = $('.ui-tabs-selected'); // '.ui-tabs-active' in jQuery 1.9+
// for page with multiple sets of tabs
var curTab2 = $('#example-2 .ui-tabs-selected'); // '.ui-tabs-active' in jQuery 1.9+
Ancora una volta, ricorda, jQuery ha fatto tutto il lavoro duro, non pensare così tanto.