Previene il comportamento predefinito dell'hash sul caricamento della pagina

Question

Ho una pagina con un'interfaccia a schede. Ogni scheda ha un ID univoco. Ho attivato i link che puntano a quella pagina con l'id aggiunto dopo l'hash e ora sto cercando di eludere il comportamento predefinito del browser che apre un URL con hash nella posizione dell'elemento nella pagina.

Quindi:

• link Pagina A alla pagina B come questo: si apre <a href="pageB.php#Tab4">Go</a>
• paginaB, e il mio jQuery attiva la scheda corretta, ma il browser ha fatto scorrere verso il basso dove <div id="Tab4"> si trova sulla pagina.

Questo è esattamente ciò che voglio impedire.

Qualche idea? Grazie!

Answer 1

Non esiste un modo per impedire il comportamento di hash predefinito, ma è possibile modificare lo schema di hash in modo che #tag non corrisponda a nessun ID sulla pagina. Al caricamento della pagina, prendi il valore hash e aggiungi una costante (es: _hash), quindi scorri fino a quella usando jQuery.

Esempio: http://mysite/page.php#tab4

page.php ha <div id="tab4_hash"></div>

al caricamento della pagina, ottenere il div facendo tab4 + _hash

Answer 2

Dopo aver finito di caricare la scheda a destra, eseguire questo:

window.location = '#'; 

Answer 3

Vorrei usare questo:

window.scrollTo(0,0); 

In questo modo non è necessario modificare l'ID dell'elemento o qualsiasi altra cosa.

Mi sono imbattuto nel problema in cui volevo scorrere verso il basso fino alla scheda, ma per qualche motivo lo scorreva in fondo alla pagina (no, non c'era un id duplicato). Penso che sia perché il browser scorreva fino all'ID prima che il contenuto finisse di caricare, e il contenuto extra spingeva l'elemento sopra la nuova posizione di scorrimento). Ho fissato con questo:

if(document.location.hash) 
{ 
    window.location = document.location.hash; 
} 

il "if" qui è obbligatorio o si potrebbe ottenere un loop infinito

Answer 4

1. Si dovrebbe solo nascondere l'elemento con id = hash per default
2. Аnd quindi, dopo il caricamento della pagina, si rende visibile l'elemento.

È possibile trovare maggiori informazioni qui: How to disable anchor "jump" when loading a page?