Expansão de um div oculto por reenvio uma âncora de página externa

Question

Eu tenho um script que oculta (display: none) certos divs na lista no carregamento da página. conteúdo Div representa descrição de um livro, e toda a lista é uma espécie de bibliografia. Cada div tem um id, por exemplo, "div1", "div2" etc.

<ul>  
<li><div class="hidden" id="div1"></li>  
<li><div class="hidden" id="div1"></li>   
...  
</ul> 

E há uma outra página com um menu, que consiste em ligações ancorado a cada uma dessas div a:

<ul>  
<li><a href="bibl.html#div1"></li>  
<li><a href="bibl.html#div2"></li>  
...  
</ul>  

Eu quero o div oculto para autoexpand quando o link em outra página é clicado. Eu tentei algumas coisas window.location.href, mas sem sucesso - meu JS é fraco ainda. Como eu entendo a lógica deve assumir a url atual e verificar se há "#", em seguida, procurar um elemento com a parte à direita no atributo id. Muito obrigado gente amável.)

Answer 1

Você pode fazer algo parecido com isso na página de destino:

window.onload = function() {
    var hash = window.location.hash; // would be "#div1" or something
    if(hash != "") {
        var id = hash.substr(1); // get rid of #
        document.getElementById(id).style.display = 'block';
    }
};

Essencialmente, você verificar o carregamento da página se href da janela tem um hash anexado a ele. Se isso acontecer, você encontra o <div> e mudar o estilo de exibição para o bloco.

Answer 2

Você pode usar o window.location.hash para ver o valor hash. De lá você pode getElementById(hashValue) e mostrá-lo.

Answer 3

Obrigado! Eu descobri que você pode adicionar este

location.href = '#' + id;

e também tem a página rolado para a posição do div referido.