Jak wymusić przeładowanie strony, jeśli wszystko, co zostało zmienione w adresie url, to hash?

Próbuję przeładować bieżącą stronę z innym skrótem url, ale to nie działa zgodnie z oczekiwaniami.

(Wyjaśnienie, jak chcę, aby to działało: przeładuj stronę, a następnie przewiń do nowego hasha.)

Podejście #1:

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

Tylko przewija do tej kotwicy bez przeładowywania strony.

Podejście #2:

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

Trochę działa, ale najpierw przewija do zakotwiczenia, następnie przeładowuje stronę, a następnie przewija ponownie do zakotwiczenia.

Podejście #3:

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

Działa, ale wolałbym nie dodawać losowych śmieci do adresu url.

Czy jest lepsze rozwiązanie?
Author: serg, 2009-10-19

4 answers

Usunąć kotwicę, do której będziesz nawigował, a następnie użyć podejścia # 2? Ponieważ nie ma kotwicy, ustawienie hash nie powinno przewijać strony.

 31
Author: Nickolay,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-10-19 16:51:59

Miałem funkcję JQuery, która uruchomiła $(document).ready(), która wykrywała, czy do adresu URL został dołączony hash, więc zachowałem tę funkcję tak samo, a następnie po prostu użyłem Force reload za każdym razem, gdy wykryto zmianę skrótu:

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

Wtedy moja inna funkcja -

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

W moim przypadku, to było w porządku dla UX -- może nie być dobre dla innych.

 3
Author: RCNeil,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-09-02 22:47:51

Należy się spodziewać, że #foo będzie przewijać do zakotwiczenia identyfikatora "foo". Jeśli chcesz użyć podejścia #1 i przeładować je, to takie podejście może zadziałać.

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)
    });
}
 2
Author: Eli Grey,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-10-19 19:27:43

Inną opcją jest usunięcie hasha i zapisanie go w pamięci sesji do pobrania przy przeładowaniu:

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

A następnie na górze swojej strony możesz mieć następujący kod:

var savedHash = sessionStorage.savedHash;
if (savedHash){
    delete sessionStorage.savedHash;
    location.hash = savedHash;
}
 0
Author: yts,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-03-16 19:28:21