Passer à l'onglet sélectionné par nom dans Jquery-UI Tabs
Si j'ai trois onglets:
<div id="tabs">
<ul>
<li><a href="#sample-tab-1"><span>One</span></a></li>
<li><a href="#sample-tab-2"><span>Two</span></a></li>
<li><a href="#sample-tab-3"><span>Three</span></a></li>
</ul>
</div>
Je voudrais échanger à #échantillon-tab-2 par son nom. Je sais que je peux passer à un onglet si je sais que c'est le nombre, mais dans le cas que j'ai pu croiser je ne sais pas.
Notes: JQuery 1.3.1 /JQuery-UI 1.6rc6
- Donc, vous voulez sélectionner l'onglet "Trois", peu importe où il est? Pourquoi avez-vous connaissez le mot "Trois", mais pas l'ID ou le nombre? Cette approche peut être problématique si jamais vous traduire votre site... pouvez-vous développer sur le problème?
- Bien sûr, ce que je suis en train de faire est décrit ici: stackoverflow.com/questions/572376/... L'approche que je vais essayer maintenant de est le changement de la valeur de hachage pour ajouter un caractère pour le nom de hachage, puis lors du chargement de la page, sélectionnez cet onglet(sans chevalier)
- Fondamentalement, <a href="#_sample-onglet-1"> définissez la fenêtre.emplacement #échantillon-onglet-1, et puis quand la page est chargée ( l'index.php#échantillon-onglet-1) interrupteur à #_sample-onglet-1
- vous n'avez pas d'identifiant/nom à la même référence dans votre exemple de code
- selon les dernières docs
$("#tabs").tabs("select", "#sample-tab-1");
devrait fonctionner - Comme de JqueryUI 1.10:
$("#tabs").tabs("option", "active", $(tabName + "Selector").index());
, voir jsfiddle.net/vpJC3 pour un exemple.
Vous devez vous connecter pour publier un commentaire.
Je ne pouvais pas obtenir la réponse précédente de travail. Je n'ai suivantes pour obtenir l'index de l'onglet par nom:
$("#tabs").tabs("select", "#sample-tab-1");
$("#tabs").tabs("option", "active", $(tabName + "Selector").index());
, voir ce jsfiddle pour plus d'info: jsfiddle.net/vpJC3Il semble que l'aide de l'id de travaux ainsi que l'index,
par exemple, simplement en faisant cela fonctionne hors de la boîte...
Cela est bien documenté dans la officiel docs:
Je suppose qu'il a été ajouté après cette question a été posée et probablement après que la plupart des réponses
$("#tabs").tabs("select", "#sample-tab-1");
, comme par le nouveau docs.Méthodes `select " n'est pas en charge de jquery ui 1.10.0.http://api.jqueryui.com/tabs/
J'utilise ce code , et de travailler correctement:
Vous pouvez obtenir l'index de l'onglet par un nom avec le script suivant:
simple-tab-2
, au lieu d'avoir ça comme unhref
).Seulement ce code de véritables œuvres!
Utiliser cette fonction:
Et utilisez le code suivant pour basculer entre les onglets:
Le seul moyen pratique d'obtenir l'index de base zéro de vos onglets est à l'étape par le biais de chacun des éléments qui font que la tabset (le LI>Un s) et le match sur leur texte interne. Il peut probablement être fait d'une manière plus propre, mais voici comment je l'ai fait.
Vous pouvez voir que j'ai utilisé un hidden <input id="reqTab"> champ dans la page, afin de s'assurer que la variable déplacé à partir d'une fonction à l'autre.
REMARQUE: Il y a un peu de gotcha -- sélectionner les onglets après la tabset est activé ne semble pas fonctionner comme annoncé dans l'INTERFACE utilisateur de jQuery 1.8, qui est pourquoi j'ai utilisé l'index identifiées à partir de mon premier passage afin d'initialiser le tabset avec l'onglet désiré sélectionné.
Le morceau suivant a fonctionné pour moi
$($("#tabs")[0]).tabs({selected: 1});
Espère que, cela aide!
essayez ce qui suit: ", sélectionnez" /"actif" de l'onglet
//`, sélectionnez " ne prend pas en charge l'interface utilisateur de jquery version 1.10.0
autre solution: utiliser "active":
Si vous modifiez le hrefs, vous pouvez attribuer un id à la liens
<a href="#sample-tab-1" id="tab1"><span>One</span></a>
de sorte que vous pouvez trouver l'onglet index par son id.@bduke de réponse en fait, il fonctionne avec une légère tweak.
Ci-dessus suppose que quelque chose de similaire à:
jQueryUI prend désormais en charge l'appel de "sélectionner" à l'aide de l'onglet ID/HREF sélecteur, mais lors de la construction des onglets, le "sélectionné" Option prend en charge uniquement l'index numérique.
Mon vote va à bdukes pour pouvoir me mettre sur la bonne voie. Merci!
Voici un exemple de code pour obtenir l'onglet sélectionné par nom. J'espère que cela vous aide à trouver ypur solution:
J'ai eu du mal à trouver les réponses à travailler comme ils l'ont été basées sur les anciennes versions de JQuery UI. Nous utilisons 1.11.4 (CDN de Référence).
Voici mon Violon avec code de travail: http://jsfiddle.net/6b0p02um/
J'ai fini par l'épissage de l'ensemble des bits à partir de quatre ou cinq threads différents pour obtenir le mien de travail:
ou, vous pouvez attribuer un id à la liens
de sorte que vous pouvez trouver l'id.
Ensemble spécifique onglet index actif:
Dernier onglet actif
Définir onglet spécifique par ID: