Schede dell'interfaccia utente JQuery: come si passa direttamente a una scheda da un'altra pagina?

Question

Le schede dell'interfaccia utente JQuery vengono implementate mediante ancore denominate in un elenco non ordinato. Quando si passa sopra una delle schede si può vedere questo nel link indicato ai piedi del browser:

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

Sopra sarebbe la scheda "ordini", per esempio. Ovviamente JQuery intercetta il clic su questa ancora e apre la scheda.

Tuttavia, se si inserisce il collegamento sopra riportato o si collega ad esso da un'altra posizione nel sito, la pagina non viene aperta nella scheda specifica.

Nel blocco di inizializzazione della scheda stavo considerando di inserire un codice che cerca un'ancora con nome nell'URL e, se ne trova uno, esegue una ricerca dell'indice delle schede e chiama la selezione su di esso. Ciò significherebbe che funzionerà ancora con JS disattivato.

Ma c'è un modo più semplice/bello/migliore?

Answer 1

Trovato questo esempio 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

Nelle versioni di jQuery UI precedenti alla 1.8 (non incluso) è praticamente il modo in cui dovresti farlo. L'estensione di tabulazione (AFAIK) non è in grado di cambiare in base a quale ancoraggio è inizializzato con (quando la pagina viene caricata), quindi è necessario eseguire manualmente quel bit (nell'evento ready, ovviamente).

Come another answer indica, la nuova versione delle schede nell'interfaccia utente jQuery 1.8 supports bookmarking out of the box.

Answer 3

A partire dalla versione 1.8 jQuery UI supporta questa funzionalità. Vedi l'esempio qui:

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

Answer 4

Io uso il plugin sessione per ottenere questo risultato in una classe scheda personalizzata