onglets jQuery UI, sélectionner / désélectionner événements (collapse)

Question

J'utilise jQuery UI 1.8.5 du plugin onglets, avec pliable: configuration réelle. Je dois appeler une fonction après un onglet est réduite d'ajouter une classe css. Est-ce que quelqu'un sait comment?

Answer 1

Vous pouvez vérifier si la classe ui-tabs-selected existe en cliquant dessus. En supposant que vous utilisez le balisage standard:

// in your click event
var selected_exists = $('#yourTabBox')
    .children('ul.ui-tabs-nav')
    .children('li.ui-tabs-selected')
    .length;

if (selected_exists) {
    // Nothing is collapsed
} else {
    // collapsed
}

Ceci est parfait pour l'événement select .

Answer 2

Qu'en est-il l'événement spectacle ne fonctionnera pas pour cela? Parce que vous ne savez pas lequel était caché?

Peut-être même sélectionner l'événement peut-être ce que vous voulez.

en utilisant le 'tabsselect' événement:

$(".selector").tabs({
    collapsible: true,
    select: function(event, ui)
    {
         var prevSelectedIndex = $(".selector").tabs('option', 'selected');
         var nextSelectedIndex = ui.index;

         if(prevSelectedIndex === -1)
         {
             // It was previously collapsed and the user is now opening
             // tab at index: nextSelectedIndex 
         }
         else if(prevSelectedIndex === nextSelectedIndex )
         {
              // The user has clicked on the currently opened
              // tab and it is collapsing
         }
    }
});