Entfernen Hash (#) von URL in Ajax Navigation ohne Aktualisierung

Ich habe eine Ajax Navigation ähnlich wie here.Entfernen Hash (#) von URL in Ajax Navigation ohne Aktualisierung

jetzt, wenn ein Menü angeklickt wird window.location.hash wird wie folgt hinzugefügt #about

Ich mag die Raute (#) entfernen, so dass die Menschen einfach den Link natürlich kopieren und teilen.

Wie kann dies im April 2012 ohne Pagerefresh Crossbrowser (IE7 +, FF, Opera, Safari) getan werden?

Zur Inspiration: Here ist eigentlich jemand schon das tun, klicken Sie auf "Portfolio" oder "Funktionen" und sehen Sie die URL in Ihrem Browser.

Dank für Tipps

Quelle

2012-04-06 Email

Eine einfache Suche hätte führen Sie die Antwort ein: http://stackoverflow.com/questions/824349/modify-the-url-without-reloading-the-page – Griffin

Do u wollen ein konvertieren Link "example.com/#about" zu "example.com/about"? In diesem Fall brauchen Sie einige Änderungen .htaccess –

Ja Prashant. was noch? – Email

Verwenden Sie die Geschichte API, wenn verfügbar. Statt die Hash-Einstellung (auf Browser, die es unterstützen), geht:

history.pushState({ /* Some state object */ }, "A title representing this state");

Dann behandelt die Zustandsänderung in einem popstate Ereignis-Listener. Wenn Sie so verfahren, bedeutet dies, dass sich die URL nicht ändert, der Verlauf aber weiterhin voll funktionsfähig ist.

Quelle

2012-04-06 23:31:29 Ryan

Was ist mit dem Umfang browserweise (ff 3+?)? was meinst du mit "wenn verfügbar"? – Email

@Email: Überprüfen Sie, ob 'history.pushState' zuerst existiert - es ist eine relativ neue HTML5-Funktion. Wenn dies nicht der Fall ist, tun Sie einfach, was Sie bereits tun, und die Benutzer müssen URLs haben, die etwas komplizierter sind. – Ryan

@Email: http://stackoverflow.com/questions/4612598/which-browsers-support-the-html5-history-api – Ryan

Was Sie suchen pushState genannt: http://badassjs.com/post/840846392/location-hash-is-dead-long-live-html5-pushstate

HTML5 gibt uns Zugang zu einem Browser-Verlauf des Browsers und lassen Sie uns uns manipulieren, um sie on-the-fly:

window.history.pushState(data, "Title", "/new-url");

Diese manipuliert die aktuelle Seite um '/ new-url' als URL und 'Title' als Titel der Seite anzuzeigen. Es gibt einige Javascript-Bibliotheken, die das für Sie behandeln werden, wie backbone.js.

Wenn Sie die URL teilen, müssen Sie Ihrer App befehlen, den richtigen Inhalt zu füttern (oder füttern Sie einfach Ihre Basis-Javascript-App, die den Inhalt für Sie einspeist).

Hoffentlich bringt Sie das in die richtige Richtung.

Quelle

2012-04-06 23:34:40 nzifnab

kann meine Anforderungen erfüllt sein, mit diesem (IE7 +, FF, Opera, Safari) keine Lösung ist? wenn nicht, was sonst noch nehmen könnte ich kümmern? ist die Backbone.js benötigt und warum?thx – Email

Es gibt keine Möglichkeit, dies ohne Verwendung von HTML5 pushState zu tun, es sei denn, Sie können die Seite aktualisieren. backbone.js ist nur ein Framework, das Ihnen hilft, sehr ajax- und Javascript-zentrierte Anwendungen zu organisieren und das Routing und dergleichen für Sie zu organisieren. Wenn Sie backbone.js verwenden und die Option "pushState: true" festlegen, greift sie auf den URL-Hash in den Browsern zurück, die pushState nicht unterstützen. Sie brauchen kein Framework wie backbone.js, es macht einfach die Arbeit einfacher. Wenn Sie IE8 oder weniger unterstützen möchten, müssen Sie Hash-Unterstützung als Fallback haben. – nzifnab

Entfernen Hash (#) von URL in Ajax Navigation ohne Aktualisierung

Antwort

Verwandte Themen