Ayant du mal à désélectionner tous les onglets jquery

Question

J'ai configuré certains onglets jQuery pour commencer sans aucun onglet sélectionné comme ceci:

$('#tabs').tabs( { selected: -1 } );  

Ensuite, j'ai aussi un lien séparé qui, lorsqu'il est pressé, doit désélectionner tous les onglets.

$("#deselectButton").click(function(){      
    $('#tabs').tabs( 'select' , -1 )
});

ou

$("#deselectButton").click(function(){      
    $('#tabs').tabs( 'selected' , -1 )
});

Le clic désélectionner le bouton désélectionne le contenu des onglets, cependant le titre des onglets reste actif avec la classe 'ui-tabs-selected ui-state-active'.

Quelle est la bonne façon de désélectionner tous les onglets?

Answer 1

Essayez ce code:

$("#deselectButton").click(function(){          
    $('#tabs').tabs( 'selected' , -1 )
    $(".ui-tabs-selected").removeClass("ui-state-active").removeClass("ui-tabs-selected");
});

Answer 2

Pour jQuery 1.10, l'option compressible doit être définie sur true.

$('#tabs').tabs('option', 'collapsible', true);
$('#tabs').tabs( 'option', 'active', false );

Answer 3

Si vous utilisez l'interface utilisateur de jQuery version 1.9+, le code CSS a été remplacé par:

$('#tabs').tabs('option', 'active', false);

ou:

$('.ui-tabs-active').removeClass('ui-tabs-active ui-state-active');

selon les commentaires ci-dessous. Merci