Wie erzwinge eine Seite neu zu laden, wenn alles, was in URL geändert wurde, Hash ist?

Ich versuche, aktuelle Seite neu laden mit verschiedenen hash-url, aber es funktioniert nicht wie erwartet.

(Klärung, wie ich das will: die Seite neu Laden und dann scrollen Sie zu dem neuen hash.)

Ansatz #1:

window.location.hash = "#" + newhash;

Nur Schriftrollen zu diesem Anker ohne Neuladen der Seite.

Ansatz #2:

window.location.hash = "#" + newhash;
window.location.reload(true);

Irgendwie funktioniert, aber es erste Schriftrollen auf den Anker, dann lädt die Seite, dann scrollt, um den Anker wieder.

Ansatz #3:

window.location.href = window.location.pathname + window.location.search + "&random=" + Math.round(Math.random()*100000) + "#" + newhash;

Funktioniert, aber ich würde lieber nicht hinzufügen zufälliger Müll an die url an.

Gibt es eine bessere Lösung?

InformationsquelleAutor der Frage serg | 2009-10-19

  1. 30

    Entfernen Sie den Anker, Sie gehen zu navigieren, verwenden Sie dann Ansatz #2? Da es keine Anker, Einstellung der hash sollte nicht die Seite scrollen.

    InformationsquelleAutor der Antwort Nickolay

  2. 3

    Ich hatte eine JQuery-Funktion abgefeuert auf $(document).ready() was erkannt, wenn es einen hash an die URL angehängt, in meinem Fall, also behielt ich die Funktion die gleiche, und nur dann verwendet ein force-reload, wenn ein hash-Veränderung festgestellt wurde:

    $(window).on('hashchange',function(){ 
    window.location.reload(true); 
});

    Dann meine anderen Funktion -

    $(document).ready(function() {
    var hash = window.location.hash;    
    if(hash) {
           //DO STUFF I WANT TO DO WITH HASHES
    }
});

    In meinem Fall, es war in Ordnung für UX -- kann nicht gut sein für andere.

    InformationsquelleAutor der Antwort RCNeil

  3. 2

    Es sollte erwartet werden, dass #foo wird, Blättern Sie zu dem Anker mit der id, "foo". Wenn Sie verwenden möchten, Ansatz #1 und haben es erneut, ist dieser Ansatz funktionieren könnte.

    if (Object.defineProperty && Object.getOwnPropertyDescriptor) { //ES5
    var hashDescriptor = Object.getOwnPropertyDescriptor(location, "hash"),
    hashSetter = hashDescriptor.set;
    hashDescriptor.set = function (hash) {
        hashSetter.call(location, hash);
        location.reload(true);
    };
    Object.defineProperty(location, "hash", hashDescriptor);
} else if (location.__lookupSetter__ && location.__defineSetter__) { //JS
    var hashSetter = location.__lookupSetter__("hash");
    location.__defineSetter__("hash", function (hash) {
        hashSetter.call(location, hash);
        location.reload(true)
    });
}

    InformationsquelleAutor der Antwort Eli Grey

  4. 0

    Weitere option ist das entfernen des hash und speichert ihn in session-Speicherung zum Abruf auf reload:

    var newUrl = location.href + '#myHash';
var splitUrl = newUrl.split('#');
newUrl = splitUrl[0];
if (splitUrl[1]){
    sessionStorage.savedHash = splitUrl[1];
}
location.href = newUrl;

    und dann oben auf der Seite können Sie den folgenden code:

    var savedHash = sessionStorage.savedHash;
if (savedHash){
    delete sessionStorage.savedHash;
    location.hash = savedHash;
}

    InformationsquelleAutor der Antwort yts

Schreibe einen Kommentar