Wie kann ich die aktuelle URL ändern?

100

Ich habe den folgenden Code, der die Seiten in JavaScript ändert:

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

Die oberste URL wird jedoch nicht geändert. Wenn also jemand auf die Schaltfläche "Zurück" klickt, wird nicht zur vorherigen Seite zurückgekehrt.

Wie kann JavaScript auch die oberste URL ändern, damit die Schaltfläche "Zurück" des Browsers funktioniert?

javascript

— Leora
quelle

165

document.location.href = newUrl;

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

— glebm
quelle

38

Einfache Zuordnung zu window.locationoder window.location.hrefsollte in Ordnung sein:

window.location = newUrl;

Ihre neue URL bewirkt jedoch, dass der Browser die neue Seite lädt. Es scheint jedoch, dass Sie die URL ändern möchten, ohne die aktuelle Seite zu verlassen. Hierfür haben Sie zwei Möglichkeiten:

Verwenden Sie den URL-Hash. Sie können beispielsweise von example.comnach example.com#foowechseln , ohne eine neue Seite zu laden. Sie können dies einfach einstellen window.location.hash. Anschließend sollten Sie das HTML5- hashchangeEreignis anhören , das ausgelöst wird, wenn der Benutzer die Zurück-Taste drückt. Dies wird in älteren IE-Versionen nicht unterstützt. Schauen Sie sich jedoch jQuery BBQ an , damit dies in allen Browsern funktioniert.
Sie können den HTML5-Verlauf verwenden, um den Pfad zu ändern, ohne die Seite neu zu laden. Dies ermöglicht es Ihnen von Änderungen example.com/foozu example.com/bar. Dies zu verwenden ist einfach:

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

Wenn der Benutzer "Zurück" drückt, erhalten Sie das popstateEreignis des Fensters , das Sie leicht anhören können (jQuery):

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

Leider wird dies nur in sehr modernen Browsern wie Chrome, Safari und der Firefox 4 Beta unterstützt.

— Bcherry
quelle

Die .replace-Methode für Zeichenfolgen ändert nicht die Zeichenfolge, auf die sie angewendet wurde, sondern generiert eine neue Zeichenfolge. " - Die window.location.replace()Methode ist nicht mit der String.prototype.replace()Methode identisch , da window.locationes sich nicht um eine Zeichenfolge handelt (es handelt sich um ein Objekt). window.location.replace()Ersetzt die aktuelle URL mit einer neuen, während der Eintrag der alten URL in der Geschichte überschrieben wird.

— Andy E

1

Vielen Dank für die Korrektur, ich werde meine Antwort entsprechend aktualisieren.

— Bcherry

2

Rückblickend ist dies bei weitem die beste Antwort. document.location.href hat nichts auf pushState

— buley

7

Hmm, ich würde verwenden

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

Ich bin mir nicht ganz sicher, ob du das meinst.

— Mixer
quelle

7

Wenn Sie nur den relativen Pfad aktualisieren möchten, können Sie dies auch tun

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

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

— Artokun
quelle

0

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

— user3230794
quelle