¿Puedo actualizar window.location.hash sin tener que desplazar la página web?

Question

Usando JavaScript, ¿hay alguna manera de actualizar window.location.hash sin desplazarse por la página web?

Tengo elementos de título seleccionables que alternan la visibilidad de un div directamente debajo de ellos. Quiero la barra/foo # en el historial al hacer clic en los títulos, pero no quiero que la página se desplace. Por lo tanto, cuando navegue desde/foo # bar, podré usar el botón Atrás y tener el div cuyo ID esté en window.location.hash visible a su regreso.

¿Este comportamiento es posible?

Answer 1

Este comportamiento es muy posible. Debería buscar en algunas de las bibliotecas que se han desarrollado para darle esta funcionalidad.

historia realmente simple: http://code.google.com/p/reallysimplehistory/ SWFAddress: http://www.asual.com/swfaddress/

Answer 2

Otra cosa que podría intentar es cambiar el id del elemento hash de los puntos de forma temporal. ¡Trabajó para mi!

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

Answer 3

Tan fácil como llegar

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

Answer 4

Para cambiar el hash sin tener la página de recarga/desplazamiento, puede ahora simplemente utilizar HTML5 history.pushState.

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

Está apoyado por todos los principales 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

También tenga en cuenta que el último parámetro url que estamos utilizando aquí, podemos ser cualquier url, por lo que no está limitado a hashes.

Answer 5

quería añadir un comentario a la respuesta Catherines, pero no tengo el representante todavía -.

gran solución sin embargo, no estaba trabajando para mí en Chrome como $ ('html') scrollTop() siempre devuelve 0 - una edición menor resuelve el problema:

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

Answer 6

Bas en la respuesta de Sunny hice esta función que también evita indefinido y 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; 
      } 
     } 
    }