Posso atualizar window.location.hash sem ter o pergaminho página web?

Question

Usando JavaScript, existe uma forma de atualizar window.location.hash sem rolar a página web?

Eu tenho elementos do título clicáveis ??que alternar a visibilidade de uma div diretamente abaixo deles. Quero que a # bar / foo na história ao clicar títulos, mas não querem a página de rolagem sobre. Assim, ao navegar longe / foo # bar eu vou ser capaz de usar o botão voltar e ter o div cujo ID está em window.location.hash ser visível em cima do retorno.

É esse comportamento possível?

Answer 1

Este comportamento é muito possível. Você deve olhar para algumas das bibliotecas que têm sido desenvolvidos para dar-lhe essa funcionalidade.

Histórico Really Simple: http://code.google.com/p/reallysimplehistory/ SWFAddress: http://www.asual.com/swfaddress/

Answer 2

Para alterar o hash sem ter o recarregamento da página / rolagem, agora você pode simplesmente usar html5 history.pushState.

history.pushState(null,null,'#hashexample');

É suportado por todos os principais navegadores:

http://caniuse.com/history

MDN:

https: //developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history#The_pushState().C2.A0method

Observe também que a última url parâmetro estamos usando aqui, ele pode ser qualquer url, então não é limitado a hashes.

Answer 3

Tão fácil como obter

var scrollmem = $('html,body').scrollTop();
window.location.hash = hash;
$('html,body').scrollTop(scrollmem);

Answer 4

Outra coisa que você poderia tentar é mudar o id do elemento os pontos de hash para temporariamente. Trabalhou para mim!

function changeHashWithoutScrolling(hash) {
  var id = hash.replace(/^.*#/, ''),
      elem = document.getElementById(id)
  elem.id = id+'-tmp'
  window.location.hash = hash
  elem.id = id
}

Answer 5

queria acrescentar um comentário à resposta Catherines, mas eu não tenho o representante ainda -

.

Great solução no entanto, não estava trabalhando para mim no Chrome quanto $ ( 'html') scrollTop () sempre retorna 0 - uma edição menor resolve o problema:

scrollmem = $('html').scrollTop() || $('body').scrollTop();
window.location.hash = hash;
$('html,body').scrollTop(scrollmem);

Answer 6

Bas sobre a resposta de Sunny Eu fiz esta função que também evita indefinido e nulos:

    function changeHashWithoutScrolling(hash) {
        var id;
        var elem;

        id = hash.replace(/^.*#/, '');

        if (id) {
            elem = document.getElementById(id);

            if (elem) {
                elem.id = id + '-tmp';
                window.location.hash = hash;
                elem.id = id;
            }
        }
    }