Página de inicio con pestaña preseleccionada que no es la primera pestaña

Question

Tengo una página con un conjunto de pestañas jqueryui. Me gustaría poder abrir la página con una pestaña que no sea la primera pestaña seleccionada. Si tengo cuatro pestañas en la página, debo poder seleccionar cualquiera de las cuatro para que sean la pestaña 'abierta'.

Esto puede ser un enlace de otra página o un enlace de una página en el mismo conjunto de marcos.

Bajo las sábanas todo es PHP.

Answer 1

Deberá seleccionar una pestaña en la carga inicial de la página a través de JavaScript. Aquí está un ejemplo de cómo seleccionar una pestaña:

http://docs.jquery.com/UI/API/1.7/Tabs#method-select

<script type="text/javascript"> 
    $(function() { 
    $("#tabs").tabs('select' , index) 
    }); 
</script> 

Cuando la variable de índice es el número entero de la ficha que desea han seleccionado. Está basado en 0, por lo que si desea seleccionar la tercera pestaña, querrá especificar 2 para el índice.

Usted querrá hacer esto una vez que la página está listo:

http://www.learningjquery.com/2006/09/introducing-document-ready

Answer 2

Pre seleccionar una pestaña que se puede hacer con la opción selected al inicializar las pestañas.

$("#tabs").tabs({ 
    selected: index //index of the tab to be preselected 
}); 

Un caso en el que esto es importante es cuando la pestaña en el índice 0 se carga con ajax. Si inicializas las pestañas como de costumbre y luego utilizas el método select para cambiar la pestaña seleccionada, inicialmente se enviará una solicitud ajax para cargar la pestaña 0. Pero dado que deseas mostrar la otra pestaña de inmediato, esta solicitud es innecesaria. La opción selected le permite omitir esta solicitud.

Answer 3

Las respuestas anteriores ya no son válidas con la versión actual de jQuery UI v1.10.0. Según la API de jQuery UI, la opción ahora es activa y ya no seleccione.

Aquí hay un enlace a la API: http://api.jqueryui.com/tabs/#option-active

inicializar las pestañas con la opción activa se especifica:

$(".selector").tabs({ active: 1 }); 

Answer 4

sólo tiene que añadir ui-tabs-selected clase a la intención <li> elemento.

jQuery seleccionará qué pestaña para activar por el camino

1. siguiente es selected opción se establece
2. Si no se establece, hace location.hash partidos de hash de <a> etiqueta
3. si no hay valores hash coinciden con cualquier ficha, hace cualquier elemento <li> tiene ui-tabs-selected clase
4. si no intentas seleccionar primero no deshabilitado (ui-state-disabled) pestaña

bit of a old question. respondido desde esta página es el primero en google