Scorri a livello di codice fino a un tag di ancoraggio

StackOverflow https://stackoverflow.com/questions/265774

  •  06-07-2019
  •  | 
  •  

Domanda

Considera il seguente codice: 

<a href="#label2">GoTo Label2</a>
... [content here] ...
<a name="label0"></a>More content
<a name="label1"></a>More content
<a name="label2"></a>More content
<a name="label3"></a>More content
<a name="label4"></a>More content

Esiste un modo per emulare facendo clic su " GoTo Label2 " link per scorrere fino alla regione appropriata sulla pagina tramite il codice?

MODIFICA : un'alternativa accettabile sarebbe quella di scorrere fino a un elemento con un ID univoco, che esiste già sulla mia pagina. Aggiungerei i tag anchor se questa è una soluzione praticabile.

È stato utile?

Soluzione

Questo JS ha generalmente funzionato bene per me se hai inserito anche un ID sull'elemento: 

document.getElementById('MyID').scrollIntoView(true);

Questo è buono in quanto posizionerà anche div scorrevoli ecc in modo che il contenuto sia visibile.

Altri suggerimenti

Uso di JavaScript: 

window.location.href = '#label2';

Se hai bisogno di farlo dal server / codice dietro, puoi semplicemente emettere questo Javascript e registrarlo come script di avvio per quella pagina.

Passando a un'ancora dal lato server, l'esempio è c #. 

ClientScript.RegisterStartupScript(this.GetType(), "hash", "location.hash = '#form';", true);

Suppongo che funzionerà: 

window.location="<yourCurrentUri>#label2";

La soluzione 

document.getElementById('MyID').scrollIntoView(true);

funziona bene in quasi tutti i browser, mentre ho notato che in alcuni browser o in alcuni dispositivi mobili (come alcune versioni di Blackberry) " scrollIntoView " la funzione non è riconosciuta, quindi prenderei in considerazione questa soluzione (un po 'più brutta della precedente): 

window.location.href = window.location.protocol + "//" + window.location.host + 
                       window.location.pathname + window.location.search + 
                       "#MyAnchor";

Se l'elemento è un tag anchor, dovresti essere in grado di fare: 

document.getElementsByName('label2')[0].focus();

no " # " quando usi window.location.hash

puoi semplicemente aprire il nuovo URL con il nome aggiunto, ad esempio http://www.example.com/mypage.htm#label2

In JavaScript, 

location.href = location.href + '#label2';
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top