Programaticamente se deslocar para uma marca de âncora

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

  •  06-07-2019
  •  | 
  •  

Pergunta

Considere o seguinte código: 

<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

Existe uma maneira de clicar emular no link "GoTo Label2" para se deslocar para a região apropriada na página através de código?

Editar : Uma alternativa aceitável seria a de rolagem para um elemento com um único-id, que já existe na minha página. Eu seria adicionar as marcas de âncora, se esta é uma solução viável.

Foi útil?

Solução

Esta JS em geral funcionou bem para mim se você também colocar um ID no elemento: 

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

Este é bom como também a posição de rolagem divs etc para que o conteúdo é visível.

Outras dicas

Usando javascript: 

window.location.href = '#label2';

Se você precisa fazê-lo a partir do servidor por trás / code, você pode apenas emitir este Javascript e registrá-lo como um script de inicialização para essa página.

Mover-se para uma âncora do lado do servidor, exemplo é c #. 

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

Acho que isso vai funcionar: 

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

A solução 

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

funciona bem em quase todos os navegadores, enquanto eu tenho notado que em alguns navegadores ou em alguma função celular (como algumas versões Blackberry) "scrollIntoView" não é reconhecido, então eu iria considerar esta solução (a mais feia pouco do que a anterior): 

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

Se o elemento é uma marca de âncora, você deve ser capaz de fazer: 

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

não "#" quando você usa window.location.hash

você pode simplesmente abrir o novo URL com o nome anexado, por exemplo http://www.example.com/mypage.htm#label2

Em JavaScript, 

location.href = location.href + '#label2';
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top