How to mask/hide URL params on and off with javascript without refresh?

Question

As the question states, how do you hide/unhide/mask URL query parameters in javascript? This site appears to be able to do something like it:

http://bernii.github.io/gauge.js/#!

(Check the "Share it! If checked, the option values will be stored in the URL so that you can easily share your settings.")

Say I have the following URL...

http://localhost/?var1=value1&var2=value2&var3=value3

How do I hide just the var2 and var3 portion such that the URL is:

http://localhost/?var1=value1

(WIth a click of a link on the page to toggle the GET variable in and out of the page without refreshing it.)

I care about hiding/masking the GET parameters with a click of a link, not retrieving them. — Rolando, Jun 19 '13 at 02:14
If you don't want the users know the parameters ,right? How about encode the parameters,using base64 or some other methods to encode them. — teemo, Jun 19 '13 at 02:26
I just want the user to be able to hide and unhide params without refreshing the page like the site I linked to depicts. I could care less about parameter encodings unless that is somehow part of the method used by the website I linked to show and hide parameters in the URL with the click of the share checkbox. — Rolando, Jun 19 '13 at 02:36

score 6 · Accepted Answer · answered Jun 19 '13 at 02:41

6

Try replaceState:

if(history.replaceState) history.replaceState({}, "", "/");

Where / is the path you want to show.

answered Jun 19 '13 at 02:41

Kernel James

score 1 · Answer 2 · answered Jun 19 '13 at 03:50

1

Create a hidden form with a POST method, fill the two params to <input type="hidden"> and submit. All with JS.

answered Jun 19 '13 at 03:50

Ondra Žižka

2 Answers2