2010-10-02 28 views
66

Tengo el siguiente código que cambia las páginas de dentro JavaScript:¿Cómo cambiar la página de dentro JavaScript

var newUrl = [some code to build up URL string]; 
window.location.replace(newUrl); 

Pero eso no cambia la URL arriba, así que cuando alguien hace clic en el botón de retroceso que doesn' volver a la página anterior.

¿Cómo puedo hacer que JavaScript cambie también la URL superior para que el botón de retroceso del navegador funcione?

Respuesta

7

Hmm, yo utilizo

No estoy muy seguro de si eso es lo que quiere decir.

28

asignación simple a window.location o window.location.href debe estar bien:

window.location = newUrl; 

Sin embargo, la nueva URL hará que el navegador para cargar la nueva página, pero suena como desea modificar la dirección URL sin salir la página actual. Tiene dos opciones para esto:

  1. Use el hash URL. Por ejemplo, puede ir desde example.com hasta example.com#foo sin cargar una página nueva. Simplemente puede configurar window.location.hash para hacerlo más fácil. Luego, debe escuchar el evento HTML5 hashchange, que se activará cuando el usuario presione el botón Atrás. Esto no es compatible con las versiones anteriores de IE, pero echa un vistazo a jQuery BBQ, que hace que esto funcione en todos los navegadores.

  2. Puede usar el historial de HTML5 para modificar la ruta sin tener que volver a cargar la página. Esto le permitirá cambiar de example.com/foo a example.com/bar. Usando esto es fácil:

    window.history.pushState("example.com/foo");

    Cuando el usuario pulsa "atrás", recibirá popstate caso de la ventana, que se puede escuchar fácilmente (jQuery):

    $(window).bind("popstate", function(e) { alert("location changed"); });

    Desafortunadamente, esto solo se admite en navegadores muy modernos, como Chrome, Safari y Firefox 4 beta.

+0

* el método .replace en cadenas no cambiará la cadena a la que se aplicó a, generará una nueva cadena. "* - el método' window.location.replace() 'no es el mismo que el método' String.prototype.replace() 'porque' window.location' no es una cadena (es un objeto). 'window.location.replace()' reemplaza la URL actual por una nueva, mientras que sobrescribiendo la entrada de la antigua URL en el historial. –

+1

Gracias por la corrección, actualizaré mi respuesta en consecuencia. – bcherry

+2

Mirando hacia atrás, esta es de lejos la mejor respuesta. document.location.href no tiene nada en pushState – buley

5

Si lo que desea es actualizar la ruta relativa también se puede hacer

window.location.pathname = '/relative-link'

"http://domain.com" -> "http://domain.com/relative-link"

Cuestiones relacionadas