JavaScript Reload the Page with Hash Value

Javascript reload the page with hash value

window.location.href += "#mypara";
location.reload();

First add the hash, then reload the page. The hash will remain there, and the page gets reloaded.

Tested, works.

---

ps: If a hash already exist in the URL, you may want to directly change it via location.hash instead of .href.

Is it possible to force the browser to reload the same page with a hash?

window.location.hash = '#myFancyHash';
window.location.reload()

This is cause a reload with the new hash

Reload page when changing hash

Don't reload the page. Instead, set up a onhashchange event handler, and adjust the left value from there:

window.onhashchange = function() {
    // do stuff
}

Otherwise, why using hash links instead of regular links? In any case, if you really want to reload, just put window.location.reload() inside the onhashchange handler...

How to reload page when hash.location are the same javascript

You can trigger an onclick event and refresh the page with location.reload(); :

function reload(e){
    e.preventDefault();
    location.href = e.target.href;
    location.reload();
}

a {
    display: block;
    width: 100px;
    height: 25px;
    background: lightgray;
    text-align: center;
    border-radius: 5px;
}

<a href="#feed" onclick="reload(event);">ok</a>

How to force a page to reload if all what was changed in url is hash?

Remove the anchor you're going to navigate to, then use approach #2? Since there's no anchor, setting the hash shouldn't scroll the page.

Reload Page (F5) with Hash Values in Url

You better parse hash in showTab function. Main problem was, you were sending hash or userView but the hash there had # at the beginning. You parse it onClick but you don't parse it onload. So I moved parsing code into the showTab function.

showTab(location.hash || "userView");
$("#nav a").click(function() {
    var hash = this.getAttribute("href");
    showTab(hash);
    return false;
});

function showTab(hash) {

    if (hash.substring(0, 1) === "#") {
        hash = hash.substring(1);
    }
    window.location.hash = hash;
    $(".displayUsers").hide();
    switch (hash) {
        case "userView":
            ViewUsers();
            break;
        case "userLogs":
            UserLogs();
            break;
        case "addUser":
            AddUser();
            break;
    }
}

function ViewUsers() {
    $("#userView").show();
}

function UserLogs() {
    $("#userLogs").show();
}

function AddUser() {
    $("#addUser").show();
}

Working fiddle
https://jsfiddle.net/ergec/z02xzatj/

Page refresh from address bar with #hash

This is desired behaviour. If your URL contains a hash string, it's not supposed to initiate a full page refresh.

Adding a hash to a URL indicates you mean to navigate within the page, not navigate to a new page. Clicking the "refresh" button indicates you want to re-request the document. Pressing enter on the URL bar and clicking refresh are very different things.

---

Related Topics