Remove Url Parameters Without Refreshing Page

Question

I am trying to remove everything after the "?" in the browser url on document ready.

Here is what I am trying:

jQuery(document).ready(function($) {

var url = window.location.href;
    url = url.split('?')[0];
});

I can do this and see it the below works:

jQuery(document).ready(function($) {

var url = window.location.href;
    alert(url.split('?')[0]);
});

Accepted Answer

Must Read

TL;DR

1- To modify current URL and add / inject it (the new modified URL) as a new URL entry to history list, use pushState:

window.history.pushState({}, document.title, "/" + "my-new-url.html");

2- To replace current URL without adding it to history entries, use replaceState:

window.history.replaceState({}, document.title, "/" + "my-new-url.html");

3- Depending on your business logic, pushState will be useful in cases such as:

you want to support the browser's back button
you want to create a new URL, add/insert/push the new URL to history entries, and make it current URL
allowing users to bookmark the page with the same parameters (to show the same contents)
to programmatically access the data through the stateObj then parse from the anchor

As I understood from your comment, you want to clean your URL without redirecting again.

Note that you cannot change the whole URL. You can just change what comes after the domain's name. This means that you cannot change but you can change what comes after .com/

 => can become =>

Remove Url Parameters Without Refreshing Page

15 Answers

Must Read

TL;DR

Alexander Ross