Pestañas de IU de JQuery: ¿Cómo puedo navegar directamente a una pestaña desde otra página?

Question

Las pestañas de IU de JQuery se implementan mediante anclas con nombre en una lista desordenada. Al pasar sobre una de las fichas se puede ver esto en el enlace que se muestra a los pies del navegador:

http://mysite/product/3/#orders 

anterior sería la pestaña "órdenes", por ejemplo. JQuery obviamente intercepta el clic en este ancla y abre la pestaña en su lugar.

Sin embargo, si marque el enlace de arriba o lo enlace desde otra parte del sitio, la página no se abrirá en la pestaña específica.

En el bloque de inicialización de pestañas estaba considerando poner algún código que busque un ancla nombrada en la URL y, si encuentra una, hace una búsqueda de índice de las pestañas y llama a la selección sobre ella. Esto significa que seguirá funcionando con JS apagado.

¿Pero hay una manera más fácil/mejor/mejor?

Answer 1

Encontrado este ejemplo here:

if(document.location.hash!='') { 
    //get the index from URL hash 
    tabSelect = document.location.hash.substr(1,document.location.hash.length); 
    $("#my-tabs").tabs('select',tabSelect-1); 
} 

Answer 2

En las versiones de jQuery UI anteriores a la 1.8 (no incluidas) es más o menos la forma en que tendrías que hacerlo. La extensión de pestañas (AFAIK) no sabe cambiar según el ancla con la que se inicializa (cuando se carga la página), por lo que debe hacer ese bit manualmente (en el evento listo, por supuesto).

Como another answer indica, la nueva versión de las pestañas en jQuery UI 1.8 supports bookmarking out of the box.

Answer 3

partir de la versión 1.8 jQuery UI soporta esta funcionalidad. Véase el ejemplo aquí:

1. Second tab active by default
2. Third tab active by default

Answer 4

utilizo el plugin Sesión de lograr esto en una clase de ficha personalizada