wake-up-neo.com

Gibt es eine Möglichkeit, die Adressleiste des Browsers zu ändern, ohne die Seite zu aktualisieren?

Ich entwickle eine Web-App. Darin befindet sich ein Abschnitt namens "Kategorien", in dem jedes Mal, wenn ein Benutzer auf eine der Kategorien klickt, ein Aktualisierungsfenster den entsprechenden Inhalt lädt.

Nachdem der Benutzer auf die Kategorie geklickt hat, möchte ich die Adressleisten-URL des Browsers von ändern

www.mysite.com/products 

zu so etwas wie

www.mysite.com/products/{selectedCat} 

ohne die Seite zu aktualisieren.
Gibt es eine Art JavaScript-API, mit der ich dies erreichen kann?

91
hashem

Mit HTML5 können Sie die URL ohne erneutes Laden ändern:

Wenn Sie einen neuen Beitrag im Verlauf des Browsers erstellen möchten (d. H. Der Zurück-Button funktioniert)

window.history.pushState('Object', 'Title', '/new-url');

Wenn Sie nur die URL ändern möchten, ohne zurückgehen zu können

window.history.replaceState('Object', 'Title', '/another-new-url');

Das Objekt kann für die Ajax-Navigation verwendet werden:

window.history.pushState({ id: 35 }, 'Viewing item #35', '/item/35');

window.onpopstate = function (e) {
  var id = e.state.id;
  load_item(id);
};

Lesen Sie hier mehr: http://www.w3.org/TR/html5-author/history.html

Eine Fallback-Lösung: https://github.com/browserstate/history.js

153
Alfred

Um das hinzuzufügen, was die Jungs bereits gesagt haben, bearbeiten Sie die window.location.hash -Eigenschaft so, dass sie mit der URL übereinstimmt, die Sie in Ihrer On-Click-Funktion haben möchten.

window.location.hash = 'category-name'; // address bar would become http://example.com/#category-name
31
roborourke

Ich glaube, dass es aus Sicherheitsgründen nicht erlaubt ist, die Adressleiste direkt auf eine völlig andere URL zu ändern, ohne zu dieser URL zu wechseln, wenn Sie damit zufrieden sind

www.meinesite.com/produkte/#{selectedCat}

d.h. ein Ankerstil-Link innerhalb derselben Seite untersucht dann die verschiedenen Verlaufs-/"Zurück-Button" -Skripte, die jetzt in den meisten Javascript-Bibliotheken vorhanden sind.

Die Erwähnung des Update-Fensters lässt mich vermuten, dass Sie asp.net verwenden. In diesem Fall ist die Ajax-Verlaufskontrolle von asp.net ein guter Ausgangspunkt

7
Justin Wignall

Ich halte dies nicht für möglich (zumindest nicht für eine völlig andere Adresse), da dies ein nicht intuitiver Missbrauch der Adressleiste wäre und Phishing-Angriffe fördern könnte.

3
Galwegian