Come posso modificare l'URL corrente?

100

Ho il seguente codice che cambia le pagine da JavaScript:

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

Ma non cambia l'URL superiore, quindi quando qualcuno fa clic sul pulsante Indietro non torna alla pagina precedente.

Come posso fare in modo che JavaScript modifichi anche l'URL superiore in modo che il pulsante Indietro del browser funzioni.

javascript

— leora
fonte

165

document.location.href = newUrl;

https://developer.mozilla.org/en-US/docs/Web/API/document.location

— glebm
fonte

38

L'assegnazione semplice a window.locationo window.location.hrefdovrebbe andare bene:

window.location = newUrl;

Tuttavia, il tuo nuovo URL farà sì che il browser carichi la nuova pagina, ma sembra che desideri modificare l'URL senza lasciare la pagina corrente. Hai due opzioni per questo:

Usa l'hash dell'URL. Ad esempio, puoi passare da example.coma example.com#foosenza caricare una nuova pagina. Puoi semplicemente impostare window.location.hashper renderlo facile. Quindi, dovresti ascoltare l' hashchangeevento HTML5 , che verrà attivato quando l'utente preme il pulsante Indietro. Questo non è supportato nelle versioni precedenti di IE, ma controlla jQuery BBQ , che lo fa funzionare in tutti i browser.
È possibile utilizzare la cronologia HTML5 per modificare il percorso senza ricaricare la pagina. Questo ti permetterà di cambiare da example.com/fooa example.com/bar. Usare questo è facile:

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

Quando l'utente preme "indietro", riceverai l' popstateevento della finestra , che puoi facilmente ascoltare (jQuery):

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

Sfortunatamente, questo è supportato solo in browser molto moderni, come Chrome, Safari e Firefox 4 beta.

— bacca
fonte

il metodo .replace sulle stringhe non cambierà la stringa a cui è stato applicato, genererà una nuova stringa. " - il window.location.replace()metodo non è lo stesso del String.prototype.replace()metodo perché window.locationnon è una stringa (è un oggetto). window.location.replace()sostituisce l'attuale URL con uno nuovo, sovrascrivendo la voce del vecchio URL nella cronologia.

— Andy E

1

Grazie per la correzione, aggiornerò la mia risposta di conseguenza.

— bcherry

2

Guardando indietro, questa è di gran lunga la risposta migliore. document.location.href non ha nulla su pushState

— buley

7

Hmm, lo userei

window.location = 'http://localhost/index.html#?options=go_here';

Non sono esattamente sicuro che sia quello che intendi.

— Miscelatore
fonte

7

Se vuoi solo aggiornare il percorso relativo puoi farlo anche

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

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

— Artokun
fonte

0

<script> 
    var url= "http://www.google.com"; 
    window.location = url; 
</script>

— user3230794
fonte