Mixing
How to remove the hash from window.location (URL) with JavaScript without page refresh?
I have URL like: http://example.com#something, how do I remove #something, without causing the page to refresh?
I attempted the following solution:
window.location.hash = '';
However, this doesn't remove the hash symbol # from the URL.
javascript window.location fragment-identifier
edited Jul 10 '17 at 6:44
Rahul Gupta
5,72633450
asked Sep 9 '09 at 2:59
Tom LehmanTom Lehman
29.7k58178255
add a comment |
I have URL like: http://example.com#something, how do I remove #something, without causing the page to refresh?
I attempted the following solution:
window.location.hash = '';
However, this doesn't remove the hash symbol # from the URL.
javascript window.location fragment-identifier
edited Jul 10 '17 at 6:44
Rahul Gupta
5,72633450
asked Sep 9 '09 at 2:59
Tom LehmanTom Lehman
29.7k58178255
3
Do you really want to do this? It'll cause a page refresh.
– seth
Sep 9 '09 at 3:08
7
Is it possible to do without a page refresh?
– Tom Lehman
Sep 9 '09 at 3:11
1
It is possible. AJAX history libraries deal with it. But it's not easy, and it has to be done differently for almost every browser. Not something you wanna get into.
– Gabriel Hurley
Sep 9 '09 at 3:14
Is there any conciderations with leaving a "#" behind other than a visual one?
– user29660
Aug 16 '16 at 10:55
Possible duplicate of Modify the URL without reloading the page
– PayteR
Sep 10 '17 at 12:53
add a comment |
I have URL like: http://example.com#something, how do I remove #something, without causing the page to refresh?
I attempted the following solution:
window.location.hash = '';
However, this doesn't remove the hash symbol # from the URL.
javascript window.location fragment-identifier
edited Jul 10 '17 at 6:44
Rahul Gupta
5,72633450
asked Sep 9 '09 at 2:59
Tom LehmanTom Lehman
29.7k58178255
I have URL like: http://example.com#something, how do I remove #something, without causing the page to refresh?
I attempted the following solution:
window.location.hash = '';
However, this doesn't remove the hash symbol # from the URL.
javascript window.location fragment-identifier
javascript window.location fragment-identifier
edited Jul 10 '17 at 6:44
Rahul Gupta
5,72633450
asked Sep 9 '09 at 2:59
Tom LehmanTom Lehman
29.7k58178255
edited Jul 10 '17 at 6:44
Rahul Gupta
5,72633450
asked Sep 9 '09 at 2:59
Tom LehmanTom Lehman
29.7k58178255
edited Jul 10 '17 at 6:44
Rahul Gupta
5,72633450
edited Jul 10 '17 at 6:44
Rahul Gupta
5,72633450
edited Jul 10 '17 at 6:44
Rahul Gupta
5,72633450
5,72633450
asked Sep 9 '09 at 2:59
Tom LehmanTom Lehman
29.7k58178255
asked Sep 9 '09 at 2:59
Tom LehmanTom Lehman
29.7k58178255
asked Sep 9 '09 at 2:59
Tom LehmanTom Lehman
29.7k58178255
29.7k58178255
3
Do you really want to do this? It'll cause a page refresh.
– seth
Sep 9 '09 at 3:08
7
Is it possible to do without a page refresh?
– Tom Lehman
Sep 9 '09 at 3:11
1
It is possible. AJAX history libraries deal with it. But it's not easy, and it has to be done differently for almost every browser. Not something you wanna get into.
– Gabriel Hurley
Sep 9 '09 at 3:14
Is there any conciderations with leaving a "#" behind other than a visual one?
– user29660
Aug 16 '16 at 10:55
Possible duplicate of Modify the URL without reloading the page
– PayteR
Sep 10 '17 at 12:53
add a comment |
3
Do you really want to do this? It'll cause a page refresh.
– seth
Sep 9 '09 at 3:08
7
Is it possible to do without a page refresh?
– Tom Lehman
Sep 9 '09 at 3:11
1
It is possible. AJAX history libraries deal with it. But it's not easy, and it has to be done differently for almost every browser. Not something you wanna get into.
– Gabriel Hurley
Sep 9 '09 at 3:14
Is there any conciderations with leaving a "#" behind other than a visual one?
– user29660
Aug 16 '16 at 10:55
Possible duplicate of Modify the URL without reloading the page
– PayteR
Sep 10 '17 at 12:53
3
3
Do you really want to do this? It'll cause a page refresh.
– seth
Sep 9 '09 at 3:08
Do you really want to do this? It'll cause a page refresh.
– seth
Sep 9 '09 at 3:08
7
7
Is it possible to do without a page refresh?
– Tom Lehman
Sep 9 '09 at 3:11
Is it possible to do without a page refresh?
– Tom Lehman
Sep 9 '09 at 3:11
1
1
It is possible. AJAX history libraries deal with it. But it's not easy, and it has to be done differently for almost every browser. Not something you wanna get into.
– Gabriel Hurley
Sep 9 '09 at 3:14
It is possible. AJAX history libraries deal with it. But it's not easy, and it has to be done differently for almost every browser. Not something you wanna get into.
– Gabriel Hurley
Sep 9 '09 at 3:14
Is there any conciderations with leaving a "#" behind other than a visual one?
– user29660
Aug 16 '16 at 10:55
Is there any conciderations with leaving a "#" behind other than a visual one?
– user29660
Aug 16 '16 at 10:55
Possible duplicate of Modify the URL without reloading the page
– PayteR
Sep 10 '17 at 12:53
Possible duplicate of Modify the URL without reloading the page
– PayteR
Sep 10 '17 at 12:53
add a comment |
13 Answers
13
active
oldest
votes
Initial question:
window.location.href.substr(0, window.location.href.indexOf('#'))
or
window.location.href.split('#')[0]
both will return the URL without the hash or anything after it.
With regards to your edit:
Any change to window.location will trigger a page refresh. You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page), but you can't get rid of the hash sign. Take your pick for which is worse...
MOST UP-TO-DATE ANSWER
The right answer on how to do it without sacrificing (either full reload or leaving the hash sign there) is down here. Leaving this answer here though with respect to being the original one in 2009 whereas the correct one which leverages new browser APIs was given 1.5 years later.
edited May 23 '17 at 12:34
Community♦
11
answered Sep 9 '09 at 3:06
Gabriel HurleyGabriel Hurley
32.8k105082
18
This is just plain wrong, you can change window.location.hash and it will not trigger a refresh.
– Evgeny
Oct 31 '10 at 20:21
59
@Evgeny -- That's what my answer says. I explicitly say that changing window.location.hash won't trigger a refresh. "You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page)".
– Gabriel Hurley
Oct 31 '10 at 22:29
3
No page reload - that is in the question. This is not the answer as it requires/forces a page reload!
– Ed_
May 28 '12 at 16:56
9
also think it should not be the ✓answer
– abernier
Jun 19 '12 at 13:38
4
This is not an answer to the OP question.
– Bryce
Nov 14 '13 at 23:42
|
show 9 more comments
Solving this problem is much more within reach nowadays. The HTML5 History API allows us to manipulate the location bar to display any URL within the current domain.
function removeHash () {
history.pushState("", document.title, window.location.pathname
+ window.location.search);
}
Working demo: http://jsfiddle.net/AndyE/ycmPt/show/
This works in Chrome 9, Firefox 4, Safari 5, Opera 11.50 and in IE 10. For unsupported browsers, you could always write a gracefully degrading script that makes use of it where available:
function removeHash () {
var scrollV, scrollH, loc = window.location;
if ("pushState" in history)
history.pushState("", document.title, loc.pathname + loc.search);
else {
// Prevent scrolling by storing the page's current scroll offset
scrollV = document.body.scrollTop;
scrollH = document.body.scrollLeft;
loc.hash = "";
// Restore the scroll offset, should be flicker free
document.body.scrollTop = scrollV;
document.body.scrollLeft = scrollH;
}
}
So you can get rid of the hash symbol, just not in all browsers — yet.
Note: if you want to replace the current page in the browser history, use replaceState() instead of pushState().
answered Mar 14 '11 at 12:38
Andy EAndy E
264k67416417
24
this should be the best answer
– Mauro Zadunaisky
Mar 9 '12 at 21:38
8
Use this line to make sure you don't lose the query string: history.pushState("", document.title, window.location.pathname + window.location.search);
– Phil Kulak
Mar 13 '12 at 15:56
6
@Phil: thanks for pointing that out, I've updated the answer accordingly. I'm too used to using pretty URLs.
– Andy E
Mar 13 '12 at 17:32
1
For older versions of IE, it seems you need to use document.documentElement instead of document.body. See this answer stackoverflow.com/a/2717272/359048
– jasonmcclurg
Aug 14 '13 at 23:09
21
I suggest using replaceState instead of pushState, to not create an extra entry in the browser history.
– Nico
Oct 6 '13 at 13:12
|
show 7 more comments
Simple and elegant:
history.replaceState({}, document.title, "."); // replace / with . to keep url
edited Jan 22 '17 at 15:23
Community♦
11
answered Jan 26 '15 at 18:02
cprcrackcprcrack
10.1k46373
3
use a dot instead of a slash if you want to stay in the same directory
– vahanpwns
Jun 11 '15 at 14:00
5
Thanks for this answer, I modified tohistory.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length));for my use case.
– Scott Jungwirth
Oct 16 '15 at 23:43
2
How could this possibly get 6 upvotes?
– MrUpsidown
Jan 14 '16 at 20:02
5
This does not preserve url query.
– Vladislav Kostenko
Jun 26 '17 at 20:15
2
My use-case was also to replace instead of push, but this makes more sense to me:history.replaceState(null, document.title, location.pathname + location.search);
– MDMower
Oct 25 '17 at 6:57
|
show 3 more comments
(Too many answers are redundant and outdated.) The best solution now is this:
history.replaceState(null, null, ' ');
answered Mar 19 '18 at 22:54
PacerierPacerier
44.3k51214518
2
THE answer. Thanks a lot for the simplest and newest answer.
– Mayeenul Islam
Nov 7 '18 at 16:54
usehistory.pushState(null, null, ' ')instead if you want to preserve history.
– nichijou
Jan 5 at 12:47
It might be useful to explain what passingnullfor thestateandtitleparameters ultimately does.
– V. Rubinetti
Feb 1 at 14:46
add a comment |
To remove the hash, you may try using this function
function remove_hash_from_url()
{
var uri = window.location.toString();
if (uri.indexOf("#") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("#"));
window.history.replaceState({}, document.title, clean_uri);
}
}
answered Feb 7 '17 at 8:05
Rahul GuptaRahul Gupta
5,72633450
add a comment |
This will remove the trailing hash as well.
eg: http://test.com/123#abc -> http://test.com/123
if(window.history.pushState) {
window.history.pushState('', '/', window.location.pathname)
} else {
window.location.hash = '';
}
answered Aug 17 '16 at 18:05
Chris GunawardenaChris Gunawardena
3,3791630
This removes any query params present in the URL :(
– kevgathuku
Aug 2 '18 at 11:53
1
@kevgathuku you can add them back with location.search, eg: ` window.history.pushState('', '/', window.location.pathname + window.location.search)`
– Chris Gunawardena
Aug 2 '18 at 12:04
add a comment |
How about the following?
window.location.hash=' '
Please note that am setting the hash to a single space and not an empty string.
Setting the hash to an invalid anchor does not cause a refresh either. Such as,
window.location.hash='invalidtag'
But, I find above solution to be misleading. This seems to indicate that there is an anchor on the given position with the given name although there isn't one. At the same time, using an empty string causes page to move to the top which can be unacceptable at times. Using a space also ensures that whenever the URL is copied and bookmarked and visited again, the page will usually be at the top and the space will be ignored.
And, hey, this is my first answer on StackOverflow. Hope someone finds it useful and it matches the community standards.
answered Feb 7 '15 at 17:58
Nibras ReezaNibras Reeza
7914
6
Setting hash to whitespace still keeps the # at the end of the URL, I think the goal is to remove it altogether.
– mahemoff
Feb 4 '16 at 12:18
1
It trails a hash at the end of the URL. The question is how to remove that.
– Gurmeet Singh
Sep 11 '17 at 5:56
add a comment |
const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);
answered Apr 2 '18 at 6:50
CaseyCasey
1,10821433
2
While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.
– rollstuhlfahrer
Apr 2 '18 at 7:07
add a comment |
<script type="text/javascript">
var uri = window.location.toString();
if (uri.indexOf("?") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("?"));
window.history.replaceState({}, document.title, clean_uri);
}
</script>
put this code on head section
answered Jan 7 '16 at 16:58
Manigandan RaamanathanManigandan Raamanathan
311
add a comment |
You can do it as below:
history.replaceState({}, document.title, window.location.href.split('#')[0]);
answered Sep 23 '18 at 12:53
METALHEADMETALHEAD
313112
add a comment |
Try the following:
window.history.back(1);
edited Jan 15 '16 at 15:03
josliber♦
37.3k1164100
answered Jul 13 '13 at 10:10
Vishal SharmaVishal Sharma
913
yeah its working thanx @Vishal Sharma
– Jimmy
Jul 27 '13 at 7:35
22
This doesn't answer the question if the user has come directly to the URL including the hash.
– nickb
Jan 5 '14 at 2:57
This trick is very useful when you just want create a link to previous page, but the link is hidden in bunch of js files.
– ValidfroM
Apr 15 '14 at 16:55
Exactly what I was looking for. This works perfectly to remove a hashtag just created by my web app in order to consume a value returned by a javasript function.
– user278859
Jun 7 '18 at 5:53
add a comment |
You can replace hash with null
var urlWithoutHash = document.location.href.replace(location.hash , "" );
answered Sep 27 '13 at 6:04
Devang BhagdevDevang Bhagdev
3951613
1
The question asks "without causing the page to refresh", but this method does refresh the page. You should note this fact in your answer, so we don't all have to waste our time finding out firsthand that you're answering a different question than the one we're actually trying to get answered here.
– Vladimir Kornea
Jan 9 '15 at 0:41
It does not refresh the page.
– Ciprian
Jul 1 '16 at 10:08
add a comment |
Here is another solution to change the location using href and clear the hash without scrolling.
The magic solution is explained here. Specs here.
const hash = window.location.hash;
history.scrollRestoration = 'manual';
window.location.href = hash;
history.pushState('', document.title, window.location.pathname);
NOTE: The proposed API is now part of WhatWG HTML Living Standard
answered Nov 29 '17 at 14:44
voscausavoscausa
7,95012046
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f1397329%2fhow-to-remove-the-hash-from-window-location-url-with-javascript-without-page-r%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
13 Answers
13
active
oldest
votes
13 Answers
13
active
oldest
votes
active
oldest
votes
active
oldest
votes
Initial question:
window.location.href.substr(0, window.location.href.indexOf('#'))
or
window.location.href.split('#')[0]
both will return the URL without the hash or anything after it.
With regards to your edit:
Any change to window.location will trigger a page refresh. You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page), but you can't get rid of the hash sign. Take your pick for which is worse...
MOST UP-TO-DATE ANSWER
The right answer on how to do it without sacrificing (either full reload or leaving the hash sign there) is down here. Leaving this answer here though with respect to being the original one in 2009 whereas the correct one which leverages new browser APIs was given 1.5 years later.
edited May 23 '17 at 12:34
Community♦
11
answered Sep 9 '09 at 3:06
Gabriel HurleyGabriel Hurley
32.8k105082
18
This is just plain wrong, you can change window.location.hash and it will not trigger a refresh.
– Evgeny
Oct 31 '10 at 20:21
59
@Evgeny -- That's what my answer says. I explicitly say that changing window.location.hash won't trigger a refresh. "You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page)".
– Gabriel Hurley
Oct 31 '10 at 22:29
3
No page reload - that is in the question. This is not the answer as it requires/forces a page reload!
– Ed_
May 28 '12 at 16:56
9
also think it should not be the ✓answer
– abernier
Jun 19 '12 at 13:38
4
This is not an answer to the OP question.
– Bryce
Nov 14 '13 at 23:42
|
show 9 more comments
Initial question:
window.location.href.substr(0, window.location.href.indexOf('#'))
or
window.location.href.split('#')[0]
both will return the URL without the hash or anything after it.
With regards to your edit:
Any change to window.location will trigger a page refresh. You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page), but you can't get rid of the hash sign. Take your pick for which is worse...
MOST UP-TO-DATE ANSWER
The right answer on how to do it without sacrificing (either full reload or leaving the hash sign there) is down here. Leaving this answer here though with respect to being the original one in 2009 whereas the correct one which leverages new browser APIs was given 1.5 years later.
edited May 23 '17 at 12:34
Community♦
11
answered Sep 9 '09 at 3:06
Gabriel HurleyGabriel Hurley
32.8k105082
18
This is just plain wrong, you can change window.location.hash and it will not trigger a refresh.
– Evgeny
Oct 31 '10 at 20:21
59
@Evgeny -- That's what my answer says. I explicitly say that changing window.location.hash won't trigger a refresh. "You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page)".
– Gabriel Hurley
Oct 31 '10 at 22:29
3
No page reload - that is in the question. This is not the answer as it requires/forces a page reload!
– Ed_
May 28 '12 at 16:56
9
also think it should not be the ✓answer
– abernier
Jun 19 '12 at 13:38
4
This is not an answer to the OP question.
– Bryce
Nov 14 '13 at 23:42
|
show 9 more comments
Initial question:
window.location.href.substr(0, window.location.href.indexOf('#'))
or
window.location.href.split('#')[0]
both will return the URL without the hash or anything after it.
With regards to your edit:
Any change to window.location will trigger a page refresh. You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page), but you can't get rid of the hash sign. Take your pick for which is worse...
MOST UP-TO-DATE ANSWER
The right answer on how to do it without sacrificing (either full reload or leaving the hash sign there) is down here. Leaving this answer here though with respect to being the original one in 2009 whereas the correct one which leverages new browser APIs was given 1.5 years later.
edited May 23 '17 at 12:34
Community♦
11
answered Sep 9 '09 at 3:06
Gabriel HurleyGabriel Hurley
32.8k105082
Initial question:
window.location.href.substr(0, window.location.href.indexOf('#'))
or
window.location.href.split('#')[0]
both will return the URL without the hash or anything after it.
With regards to your edit:
Any change to window.location will trigger a page refresh. You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page), but you can't get rid of the hash sign. Take your pick for which is worse...
MOST UP-TO-DATE ANSWER
The right answer on how to do it without sacrificing (either full reload or leaving the hash sign there) is down here. Leaving this answer here though with respect to being the original one in 2009 whereas the correct one which leverages new browser APIs was given 1.5 years later.
edited May 23 '17 at 12:34
Community♦
11
answered Sep 9 '09 at 3:06
Gabriel HurleyGabriel Hurley
32.8k105082
edited May 23 '17 at 12:34
Community♦
11
edited May 23 '17 at 12:34
Community♦
11
edited May 23 '17 at 12:34
Community♦
11
11
answered Sep 9 '09 at 3:06
Gabriel HurleyGabriel Hurley
32.8k105082
answered Sep 9 '09 at 3:06
Gabriel HurleyGabriel Hurley
32.8k105082
answered Sep 9 '09 at 3:06
Gabriel HurleyGabriel Hurley
32.8k105082
32.8k105082
18
This is just plain wrong, you can change window.location.hash and it will not trigger a refresh.
– Evgeny
Oct 31 '10 at 20:21
59
@Evgeny -- That's what my answer says. I explicitly say that changing window.location.hash won't trigger a refresh. "You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page)".
– Gabriel Hurley
Oct 31 '10 at 22:29
3
No page reload - that is in the question. This is not the answer as it requires/forces a page reload!
– Ed_
May 28 '12 at 16:56
9
also think it should not be the ✓answer
– abernier
Jun 19 '12 at 13:38
4
This is not an answer to the OP question.
– Bryce
Nov 14 '13 at 23:42
|
show 9 more comments
18
This is just plain wrong, you can change window.location.hash and it will not trigger a refresh.
– Evgeny
Oct 31 '10 at 20:21
59
@Evgeny -- That's what my answer says. I explicitly say that changing window.location.hash won't trigger a refresh. "You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page)".
– Gabriel Hurley
Oct 31 '10 at 22:29
3
No page reload - that is in the question. This is not the answer as it requires/forces a page reload!
– Ed_
May 28 '12 at 16:56
9
also think it should not be the ✓answer
– abernier
Jun 19 '12 at 13:38
4
This is not an answer to the OP question.
– Bryce
Nov 14 '13 at 23:42
18
18
This is just plain wrong, you can change window.location.hash and it will not trigger a refresh.
– Evgeny
Oct 31 '10 at 20:21
This is just plain wrong, you can change window.location.hash and it will not trigger a refresh.
– Evgeny
Oct 31 '10 at 20:21
59
59
@Evgeny -- That's what my answer says. I explicitly say that changing window.location.hash won't trigger a refresh. "You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page)".
– Gabriel Hurley
Oct 31 '10 at 22:29
@Evgeny -- That's what my answer says. I explicitly say that changing window.location.hash won't trigger a refresh. "You can change window.location.hash without triggering the refresh (though the window will jump if your hash matches an id on the page)".
– Gabriel Hurley
Oct 31 '10 at 22:29
3
3
No page reload - that is in the question. This is not the answer as it requires/forces a page reload!
– Ed_
May 28 '12 at 16:56
No page reload - that is in the question. This is not the answer as it requires/forces a page reload!
– Ed_
May 28 '12 at 16:56
9
9
also think it should not be the ✓answer
– abernier
Jun 19 '12 at 13:38
also think it should not be the ✓answer
– abernier
Jun 19 '12 at 13:38
4
4
This is not an answer to the OP question.
– Bryce
Nov 14 '13 at 23:42
This is not an answer to the OP question.
– Bryce
Nov 14 '13 at 23:42
|
show 9 more comments
Solving this problem is much more within reach nowadays. The HTML5 History API allows us to manipulate the location bar to display any URL within the current domain.
function removeHash () {
history.pushState("", document.title, window.location.pathname
+ window.location.search);
}
Working demo: http://jsfiddle.net/AndyE/ycmPt/show/
This works in Chrome 9, Firefox 4, Safari 5, Opera 11.50 and in IE 10. For unsupported browsers, you could always write a gracefully degrading script that makes use of it where available:
function removeHash () {
var scrollV, scrollH, loc = window.location;
if ("pushState" in history)
history.pushState("", document.title, loc.pathname + loc.search);
else {
// Prevent scrolling by storing the page's current scroll offset
scrollV = document.body.scrollTop;
scrollH = document.body.scrollLeft;
loc.hash = "";
// Restore the scroll offset, should be flicker free
document.body.scrollTop = scrollV;
document.body.scrollLeft = scrollH;
}
}
So you can get rid of the hash symbol, just not in all browsers — yet.
Note: if you want to replace the current page in the browser history, use replaceState() instead of pushState().
answered Mar 14 '11 at 12:38
Andy EAndy E
264k67416417
24
this should be the best answer
– Mauro Zadunaisky
Mar 9 '12 at 21:38
8
Use this line to make sure you don't lose the query string: history.pushState("", document.title, window.location.pathname + window.location.search);
– Phil Kulak
Mar 13 '12 at 15:56
6
@Phil: thanks for pointing that out, I've updated the answer accordingly. I'm too used to using pretty URLs.
– Andy E
Mar 13 '12 at 17:32
1
For older versions of IE, it seems you need to use document.documentElement instead of document.body. See this answer stackoverflow.com/a/2717272/359048
– jasonmcclurg
Aug 14 '13 at 23:09
21
I suggest using replaceState instead of pushState, to not create an extra entry in the browser history.
– Nico
Oct 6 '13 at 13:12
|
show 7 more comments
Solving this problem is much more within reach nowadays. The HTML5 History API allows us to manipulate the location bar to display any URL within the current domain.
function removeHash () {
history.pushState("", document.title, window.location.pathname
+ window.location.search);
}
Working demo: http://jsfiddle.net/AndyE/ycmPt/show/
This works in Chrome 9, Firefox 4, Safari 5, Opera 11.50 and in IE 10. For unsupported browsers, you could always write a gracefully degrading script that makes use of it where available:
function removeHash () {
var scrollV, scrollH, loc = window.location;
if ("pushState" in history)
history.pushState("", document.title, loc.pathname + loc.search);
else {
// Prevent scrolling by storing the page's current scroll offset
scrollV = document.body.scrollTop;
scrollH = document.body.scrollLeft;
loc.hash = "";
// Restore the scroll offset, should be flicker free
document.body.scrollTop = scrollV;
document.body.scrollLeft = scrollH;
}
}
So you can get rid of the hash symbol, just not in all browsers — yet.
Note: if you want to replace the current page in the browser history, use replaceState() instead of pushState().
answered Mar 14 '11 at 12:38
Andy EAndy E
264k67416417
24
this should be the best answer
– Mauro Zadunaisky
Mar 9 '12 at 21:38
8
Use this line to make sure you don't lose the query string: history.pushState("", document.title, window.location.pathname + window.location.search);
– Phil Kulak
Mar 13 '12 at 15:56
6
@Phil: thanks for pointing that out, I've updated the answer accordingly. I'm too used to using pretty URLs.
– Andy E
Mar 13 '12 at 17:32
1
For older versions of IE, it seems you need to use document.documentElement instead of document.body. See this answer stackoverflow.com/a/2717272/359048
– jasonmcclurg
Aug 14 '13 at 23:09
21
I suggest using replaceState instead of pushState, to not create an extra entry in the browser history.
– Nico
Oct 6 '13 at 13:12
|
show 7 more comments
Solving this problem is much more within reach nowadays. The HTML5 History API allows us to manipulate the location bar to display any URL within the current domain.
function removeHash () {
history.pushState("", document.title, window.location.pathname
+ window.location.search);
}
Working demo: http://jsfiddle.net/AndyE/ycmPt/show/
This works in Chrome 9, Firefox 4, Safari 5, Opera 11.50 and in IE 10. For unsupported browsers, you could always write a gracefully degrading script that makes use of it where available:
function removeHash () {
var scrollV, scrollH, loc = window.location;
if ("pushState" in history)
history.pushState("", document.title, loc.pathname + loc.search);
else {
// Prevent scrolling by storing the page's current scroll offset
scrollV = document.body.scrollTop;
scrollH = document.body.scrollLeft;
loc.hash = "";
// Restore the scroll offset, should be flicker free
document.body.scrollTop = scrollV;
document.body.scrollLeft = scrollH;
}
}
So you can get rid of the hash symbol, just not in all browsers — yet.
Note: if you want to replace the current page in the browser history, use replaceState() instead of pushState().
answered Mar 14 '11 at 12:38
Andy EAndy E
264k67416417
Solving this problem is much more within reach nowadays. The HTML5 History API allows us to manipulate the location bar to display any URL within the current domain.
function removeHash () {
history.pushState("", document.title, window.location.pathname
+ window.location.search);
}
Working demo: http://jsfiddle.net/AndyE/ycmPt/show/
This works in Chrome 9, Firefox 4, Safari 5, Opera 11.50 and in IE 10. For unsupported browsers, you could always write a gracefully degrading script that makes use of it where available:
function removeHash () {
var scrollV, scrollH, loc = window.location;
if ("pushState" in history)
history.pushState("", document.title, loc.pathname + loc.search);
else {
// Prevent scrolling by storing the page's current scroll offset
scrollV = document.body.scrollTop;
scrollH = document.body.scrollLeft;
loc.hash = "";
// Restore the scroll offset, should be flicker free
document.body.scrollTop = scrollV;
document.body.scrollLeft = scrollH;
}
}
So you can get rid of the hash symbol, just not in all browsers — yet.
Note: if you want to replace the current page in the browser history, use replaceState() instead of pushState().
answered Mar 14 '11 at 12:38
Andy EAndy E
264k67416417
edited Jul 9 '14 at 9:32
answered Mar 14 '11 at 12:38
Andy EAndy E
264k67416417
answered Mar 14 '11 at 12:38
Andy EAndy E
264k67416417
answered Mar 14 '11 at 12:38
Andy EAndy E
264k67416417
264k67416417
24
this should be the best answer
– Mauro Zadunaisky
Mar 9 '12 at 21:38
8
Use this line to make sure you don't lose the query string: history.pushState("", document.title, window.location.pathname + window.location.search);
– Phil Kulak
Mar 13 '12 at 15:56
6
@Phil: thanks for pointing that out, I've updated the answer accordingly. I'm too used to using pretty URLs.
– Andy E
Mar 13 '12 at 17:32
1
For older versions of IE, it seems you need to use document.documentElement instead of document.body. See this answer stackoverflow.com/a/2717272/359048
– jasonmcclurg
Aug 14 '13 at 23:09
21
I suggest using replaceState instead of pushState, to not create an extra entry in the browser history.
– Nico
Oct 6 '13 at 13:12
|
show 7 more comments
24
this should be the best answer
– Mauro Zadunaisky
Mar 9 '12 at 21:38
8
Use this line to make sure you don't lose the query string: history.pushState("", document.title, window.location.pathname + window.location.search);
– Phil Kulak
Mar 13 '12 at 15:56
6
@Phil: thanks for pointing that out, I've updated the answer accordingly. I'm too used to using pretty URLs.
– Andy E
Mar 13 '12 at 17:32
1
For older versions of IE, it seems you need to use document.documentElement instead of document.body. See this answer stackoverflow.com/a/2717272/359048
– jasonmcclurg
Aug 14 '13 at 23:09
21
I suggest using replaceState instead of pushState, to not create an extra entry in the browser history.
– Nico
Oct 6 '13 at 13:12
24
24
this should be the best answer
– Mauro Zadunaisky
Mar 9 '12 at 21:38
this should be the best answer
– Mauro Zadunaisky
Mar 9 '12 at 21:38
8
8
Use this line to make sure you don't lose the query string: history.pushState("", document.title, window.location.pathname + window.location.search);
– Phil Kulak
Mar 13 '12 at 15:56
Use this line to make sure you don't lose the query string: history.pushState("", document.title, window.location.pathname + window.location.search);
– Phil Kulak
Mar 13 '12 at 15:56
6
6
@Phil: thanks for pointing that out, I've updated the answer accordingly. I'm too used to using pretty URLs.
– Andy E
Mar 13 '12 at 17:32
@Phil: thanks for pointing that out, I've updated the answer accordingly. I'm too used to using pretty URLs.
– Andy E
Mar 13 '12 at 17:32
1
1
For older versions of IE, it seems you need to use document.documentElement instead of document.body. See this answer stackoverflow.com/a/2717272/359048
– jasonmcclurg
Aug 14 '13 at 23:09
For older versions of IE, it seems you need to use document.documentElement instead of document.body. See this answer stackoverflow.com/a/2717272/359048
– jasonmcclurg
Aug 14 '13 at 23:09
21
21
I suggest using replaceState instead of pushState, to not create an extra entry in the browser history.
– Nico
Oct 6 '13 at 13:12
I suggest using replaceState instead of pushState, to not create an extra entry in the browser history.
– Nico
Oct 6 '13 at 13:12
|
show 7 more comments
Simple and elegant:
history.replaceState({}, document.title, "."); // replace / with . to keep url
edited Jan 22 '17 at 15:23
Community♦
11
answered Jan 26 '15 at 18:02
cprcrackcprcrack
10.1k46373
3
use a dot instead of a slash if you want to stay in the same directory
– vahanpwns
Jun 11 '15 at 14:00
5
Thanks for this answer, I modified tohistory.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length));for my use case.
– Scott Jungwirth
Oct 16 '15 at 23:43
2
How could this possibly get 6 upvotes?
– MrUpsidown
Jan 14 '16 at 20:02
5
This does not preserve url query.
– Vladislav Kostenko
Jun 26 '17 at 20:15
2
My use-case was also to replace instead of push, but this makes more sense to me:history.replaceState(null, document.title, location.pathname + location.search);
– MDMower
Oct 25 '17 at 6:57
|
show 3 more comments
Simple and elegant:
history.replaceState({}, document.title, "."); // replace / with . to keep url
edited Jan 22 '17 at 15:23
Community♦
11
answered Jan 26 '15 at 18:02
cprcrackcprcrack
10.1k46373
3
use a dot instead of a slash if you want to stay in the same directory
– vahanpwns
Jun 11 '15 at 14:00
5
Thanks for this answer, I modified tohistory.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length));for my use case.
– Scott Jungwirth
Oct 16 '15 at 23:43
2
How could this possibly get 6 upvotes?
– MrUpsidown
Jan 14 '16 at 20:02
5
This does not preserve url query.
– Vladislav Kostenko
Jun 26 '17 at 20:15
2
My use-case was also to replace instead of push, but this makes more sense to me:history.replaceState(null, document.title, location.pathname + location.search);
– MDMower
Oct 25 '17 at 6:57
|
show 3 more comments
Simple and elegant:
history.replaceState({}, document.title, "."); // replace / with . to keep url
edited Jan 22 '17 at 15:23
Community♦
11
answered Jan 26 '15 at 18:02
cprcrackcprcrack
10.1k46373
Simple and elegant:
history.replaceState({}, document.title, "."); // replace / with . to keep url
edited Jan 22 '17 at 15:23
Community♦
11
answered Jan 26 '15 at 18:02
cprcrackcprcrack
10.1k46373
edited Jan 22 '17 at 15:23
Community♦
11
edited Jan 22 '17 at 15:23
Community♦
11
edited Jan 22 '17 at 15:23
Community♦
11
11
answered Jan 26 '15 at 18:02
cprcrackcprcrack
10.1k46373
answered Jan 26 '15 at 18:02
cprcrackcprcrack
10.1k46373
answered Jan 26 '15 at 18:02
cprcrackcprcrack
10.1k46373
10.1k46373
3
use a dot instead of a slash if you want to stay in the same directory
– vahanpwns
Jun 11 '15 at 14:00
5
Thanks for this answer, I modified tohistory.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length));for my use case.
– Scott Jungwirth
Oct 16 '15 at 23:43
2
How could this possibly get 6 upvotes?
– MrUpsidown
Jan 14 '16 at 20:02
5
This does not preserve url query.
– Vladislav Kostenko
Jun 26 '17 at 20:15
2
My use-case was also to replace instead of push, but this makes more sense to me:history.replaceState(null, document.title, location.pathname + location.search);
– MDMower
Oct 25 '17 at 6:57
|
show 3 more comments
3
use a dot instead of a slash if you want to stay in the same directory
– vahanpwns
Jun 11 '15 at 14:00
5
Thanks for this answer, I modified tohistory.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length));for my use case.
– Scott Jungwirth
Oct 16 '15 at 23:43
2
How could this possibly get 6 upvotes?
– MrUpsidown
Jan 14 '16 at 20:02
5
This does not preserve url query.
– Vladislav Kostenko
Jun 26 '17 at 20:15
2
My use-case was also to replace instead of push, but this makes more sense to me:history.replaceState(null, document.title, location.pathname + location.search);
– MDMower
Oct 25 '17 at 6:57
3
3
use a dot instead of a slash if you want to stay in the same directory
– vahanpwns
Jun 11 '15 at 14:00
use a dot instead of a slash if you want to stay in the same directory
– vahanpwns
Jun 11 '15 at 14:00
5
5
Thanks for this answer, I modified to
history.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length)); for my use case.– Scott Jungwirth
Oct 16 '15 at 23:43
Thanks for this answer, I modified to
history.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length)); for my use case.– Scott Jungwirth
Oct 16 '15 at 23:43
2
2
How could this possibly get 6 upvotes?
– MrUpsidown
Jan 14 '16 at 20:02
How could this possibly get 6 upvotes?
– MrUpsidown
Jan 14 '16 at 20:02
5
5
This does not preserve url query.
– Vladislav Kostenko
Jun 26 '17 at 20:15
This does not preserve url query.
– Vladislav Kostenko
Jun 26 '17 at 20:15
2
2
My use-case was also to replace instead of push, but this makes more sense to me:
history.replaceState(null, document.title, location.pathname + location.search);– MDMower
Oct 25 '17 at 6:57
My use-case was also to replace instead of push, but this makes more sense to me:
history.replaceState(null, document.title, location.pathname + location.search);– MDMower
Oct 25 '17 at 6:57
|
show 3 more comments
(Too many answers are redundant and outdated.) The best solution now is this:
history.replaceState(null, null, ' ');
answered Mar 19 '18 at 22:54
PacerierPacerier
44.3k51214518
2
THE answer. Thanks a lot for the simplest and newest answer.
– Mayeenul Islam
Nov 7 '18 at 16:54
usehistory.pushState(null, null, ' ')instead if you want to preserve history.
– nichijou
Jan 5 at 12:47
It might be useful to explain what passingnullfor thestateandtitleparameters ultimately does.
– V. Rubinetti
Feb 1 at 14:46
add a comment |
(Too many answers are redundant and outdated.) The best solution now is this:
history.replaceState(null, null, ' ');
answered Mar 19 '18 at 22:54
PacerierPacerier
44.3k51214518
2
THE answer. Thanks a lot for the simplest and newest answer.
– Mayeenul Islam
Nov 7 '18 at 16:54
usehistory.pushState(null, null, ' ')instead if you want to preserve history.
– nichijou
Jan 5 at 12:47
It might be useful to explain what passingnullfor thestateandtitleparameters ultimately does.
– V. Rubinetti
Feb 1 at 14:46
add a comment |
(Too many answers are redundant and outdated.) The best solution now is this:
history.replaceState(null, null, ' ');
answered Mar 19 '18 at 22:54
PacerierPacerier
44.3k51214518
(Too many answers are redundant and outdated.) The best solution now is this:
history.replaceState(null, null, ' ');
answered Mar 19 '18 at 22:54
PacerierPacerier
44.3k51214518
answered Mar 19 '18 at 22:54
PacerierPacerier
44.3k51214518
answered Mar 19 '18 at 22:54
PacerierPacerier
44.3k51214518
answered Mar 19 '18 at 22:54
PacerierPacerier
44.3k51214518
44.3k51214518
2
THE answer. Thanks a lot for the simplest and newest answer.
– Mayeenul Islam
Nov 7 '18 at 16:54
usehistory.pushState(null, null, ' ')instead if you want to preserve history.
– nichijou
Jan 5 at 12:47
It might be useful to explain what passingnullfor thestateandtitleparameters ultimately does.
– V. Rubinetti
Feb 1 at 14:46
add a comment |
2
THE answer. Thanks a lot for the simplest and newest answer.
– Mayeenul Islam
Nov 7 '18 at 16:54
usehistory.pushState(null, null, ' ')instead if you want to preserve history.
– nichijou
Jan 5 at 12:47
It might be useful to explain what passingnullfor thestateandtitleparameters ultimately does.
– V. Rubinetti
Feb 1 at 14:46
2
2
THE answer. Thanks a lot for the simplest and newest answer.
– Mayeenul Islam
Nov 7 '18 at 16:54
THE answer. Thanks a lot for the simplest and newest answer.
– Mayeenul Islam
Nov 7 '18 at 16:54
use
history.pushState(null, null, ' ') instead if you want to preserve history.– nichijou
Jan 5 at 12:47
use
history.pushState(null, null, ' ') instead if you want to preserve history.– nichijou
Jan 5 at 12:47
It might be useful to explain what passing
null for the state and title parameters ultimately does.– V. Rubinetti
Feb 1 at 14:46
It might be useful to explain what passing
null for the state and title parameters ultimately does.– V. Rubinetti
Feb 1 at 14:46
add a comment |
To remove the hash, you may try using this function
function remove_hash_from_url()
{
var uri = window.location.toString();
if (uri.indexOf("#") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("#"));
window.history.replaceState({}, document.title, clean_uri);
}
}
answered Feb 7 '17 at 8:05
Rahul GuptaRahul Gupta
5,72633450
add a comment |
To remove the hash, you may try using this function
function remove_hash_from_url()
{
var uri = window.location.toString();
if (uri.indexOf("#") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("#"));
window.history.replaceState({}, document.title, clean_uri);
}
}
answered Feb 7 '17 at 8:05
Rahul GuptaRahul Gupta
5,72633450
add a comment |
To remove the hash, you may try using this function
function remove_hash_from_url()
{
var uri = window.location.toString();
if (uri.indexOf("#") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("#"));
window.history.replaceState({}, document.title, clean_uri);
}
}
answered Feb 7 '17 at 8:05
Rahul GuptaRahul Gupta
5,72633450
To remove the hash, you may try using this function
function remove_hash_from_url()
{
var uri = window.location.toString();
if (uri.indexOf("#") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("#"));
window.history.replaceState({}, document.title, clean_uri);
}
}
answered Feb 7 '17 at 8:05
Rahul GuptaRahul Gupta
5,72633450
edited Feb 7 '17 at 8:13
answered Feb 7 '17 at 8:05
Rahul GuptaRahul Gupta
5,72633450
answered Feb 7 '17 at 8:05
Rahul GuptaRahul Gupta
5,72633450
answered Feb 7 '17 at 8:05
Rahul GuptaRahul Gupta
5,72633450
5,72633450
add a comment |
add a comment |
This will remove the trailing hash as well.
eg: http://test.com/123#abc -> http://test.com/123
if(window.history.pushState) {
window.history.pushState('', '/', window.location.pathname)
} else {
window.location.hash = '';
}
answered Aug 17 '16 at 18:05
Chris GunawardenaChris Gunawardena
3,3791630
This removes any query params present in the URL :(
– kevgathuku
Aug 2 '18 at 11:53
1
@kevgathuku you can add them back with location.search, eg: ` window.history.pushState('', '/', window.location.pathname + window.location.search)`
– Chris Gunawardena
Aug 2 '18 at 12:04
add a comment |
This will remove the trailing hash as well.
eg: http://test.com/123#abc -> http://test.com/123
if(window.history.pushState) {
window.history.pushState('', '/', window.location.pathname)
} else {
window.location.hash = '';
}
answered Aug 17 '16 at 18:05
Chris GunawardenaChris Gunawardena
3,3791630
This removes any query params present in the URL :(
– kevgathuku
Aug 2 '18 at 11:53
1
@kevgathuku you can add them back with location.search, eg: ` window.history.pushState('', '/', window.location.pathname + window.location.search)`
– Chris Gunawardena
Aug 2 '18 at 12:04
add a comment |
This will remove the trailing hash as well.
eg: http://test.com/123#abc -> http://test.com/123
if(window.history.pushState) {
window.history.pushState('', '/', window.location.pathname)
} else {
window.location.hash = '';
}
answered Aug 17 '16 at 18:05
Chris GunawardenaChris Gunawardena
3,3791630
This will remove the trailing hash as well.
eg: http://test.com/123#abc -> http://test.com/123
if(window.history.pushState) {
window.history.pushState('', '/', window.location.pathname)
} else {
window.location.hash = '';
}
answered Aug 17 '16 at 18:05
Chris GunawardenaChris Gunawardena
3,3791630
answered Aug 17 '16 at 18:05
Chris GunawardenaChris Gunawardena
3,3791630
answered Aug 17 '16 at 18:05
Chris GunawardenaChris Gunawardena
3,3791630
answered Aug 17 '16 at 18:05
Chris GunawardenaChris Gunawardena
3,3791630
3,3791630
This removes any query params present in the URL :(
– kevgathuku
Aug 2 '18 at 11:53
1
@kevgathuku you can add them back with location.search, eg: ` window.history.pushState('', '/', window.location.pathname + window.location.search)`
– Chris Gunawardena
Aug 2 '18 at 12:04
add a comment |
This removes any query params present in the URL :(
– kevgathuku
Aug 2 '18 at 11:53
1
@kevgathuku you can add them back with location.search, eg: ` window.history.pushState('', '/', window.location.pathname + window.location.search)`
– Chris Gunawardena
Aug 2 '18 at 12:04
This removes any query params present in the URL :(
– kevgathuku
Aug 2 '18 at 11:53
This removes any query params present in the URL :(
– kevgathuku
Aug 2 '18 at 11:53
1
1
@kevgathuku you can add them back with location.search, eg: ` window.history.pushState('', '/', window.location.pathname + window.location.search)`
– Chris Gunawardena
Aug 2 '18 at 12:04
@kevgathuku you can add them back with location.search, eg: ` window.history.pushState('', '/', window.location.pathname + window.location.search)`
– Chris Gunawardena
Aug 2 '18 at 12:04
add a comment |
How about the following?
window.location.hash=' '
Please note that am setting the hash to a single space and not an empty string.
Setting the hash to an invalid anchor does not cause a refresh either. Such as,
window.location.hash='invalidtag'
But, I find above solution to be misleading. This seems to indicate that there is an anchor on the given position with the given name although there isn't one. At the same time, using an empty string causes page to move to the top which can be unacceptable at times. Using a space also ensures that whenever the URL is copied and bookmarked and visited again, the page will usually be at the top and the space will be ignored.
And, hey, this is my first answer on StackOverflow. Hope someone finds it useful and it matches the community standards.
answered Feb 7 '15 at 17:58
Nibras ReezaNibras Reeza
7914
6
Setting hash to whitespace still keeps the # at the end of the URL, I think the goal is to remove it altogether.
– mahemoff
Feb 4 '16 at 12:18
1
It trails a hash at the end of the URL. The question is how to remove that.
– Gurmeet Singh
Sep 11 '17 at 5:56
add a comment |
How about the following?
window.location.hash=' '
Please note that am setting the hash to a single space and not an empty string.
Setting the hash to an invalid anchor does not cause a refresh either. Such as,
window.location.hash='invalidtag'
But, I find above solution to be misleading. This seems to indicate that there is an anchor on the given position with the given name although there isn't one. At the same time, using an empty string causes page to move to the top which can be unacceptable at times. Using a space also ensures that whenever the URL is copied and bookmarked and visited again, the page will usually be at the top and the space will be ignored.
And, hey, this is my first answer on StackOverflow. Hope someone finds it useful and it matches the community standards.
answered Feb 7 '15 at 17:58
Nibras ReezaNibras Reeza
7914
6
Setting hash to whitespace still keeps the # at the end of the URL, I think the goal is to remove it altogether.
– mahemoff
Feb 4 '16 at 12:18
1
It trails a hash at the end of the URL. The question is how to remove that.
– Gurmeet Singh
Sep 11 '17 at 5:56
add a comment |
How about the following?
window.location.hash=' '
Please note that am setting the hash to a single space and not an empty string.
Setting the hash to an invalid anchor does not cause a refresh either. Such as,
window.location.hash='invalidtag'
But, I find above solution to be misleading. This seems to indicate that there is an anchor on the given position with the given name although there isn't one. At the same time, using an empty string causes page to move to the top which can be unacceptable at times. Using a space also ensures that whenever the URL is copied and bookmarked and visited again, the page will usually be at the top and the space will be ignored.
And, hey, this is my first answer on StackOverflow. Hope someone finds it useful and it matches the community standards.
answered Feb 7 '15 at 17:58
Nibras ReezaNibras Reeza
7914
How about the following?
window.location.hash=' '
Please note that am setting the hash to a single space and not an empty string.
Setting the hash to an invalid anchor does not cause a refresh either. Such as,
window.location.hash='invalidtag'
But, I find above solution to be misleading. This seems to indicate that there is an anchor on the given position with the given name although there isn't one. At the same time, using an empty string causes page to move to the top which can be unacceptable at times. Using a space also ensures that whenever the URL is copied and bookmarked and visited again, the page will usually be at the top and the space will be ignored.
And, hey, this is my first answer on StackOverflow. Hope someone finds it useful and it matches the community standards.
answered Feb 7 '15 at 17:58
Nibras ReezaNibras Reeza
7914
edited Feb 7 '15 at 18:03
answered Feb 7 '15 at 17:58
Nibras ReezaNibras Reeza
7914
answered Feb 7 '15 at 17:58
Nibras ReezaNibras Reeza
7914
answered Feb 7 '15 at 17:58
Nibras ReezaNibras Reeza
7914
7914
6
Setting hash to whitespace still keeps the # at the end of the URL, I think the goal is to remove it altogether.
– mahemoff
Feb 4 '16 at 12:18
1
It trails a hash at the end of the URL. The question is how to remove that.
– Gurmeet Singh
Sep 11 '17 at 5:56
add a comment |
6
Setting hash to whitespace still keeps the # at the end of the URL, I think the goal is to remove it altogether.
– mahemoff
Feb 4 '16 at 12:18
1
It trails a hash at the end of the URL. The question is how to remove that.
– Gurmeet Singh
Sep 11 '17 at 5:56
6
6
Setting hash to whitespace still keeps the # at the end of the URL, I think the goal is to remove it altogether.
– mahemoff
Feb 4 '16 at 12:18
Setting hash to whitespace still keeps the # at the end of the URL, I think the goal is to remove it altogether.
– mahemoff
Feb 4 '16 at 12:18
1
1
It trails a hash at the end of the URL. The question is how to remove that.
– Gurmeet Singh
Sep 11 '17 at 5:56
It trails a hash at the end of the URL. The question is how to remove that.
– Gurmeet Singh
Sep 11 '17 at 5:56
add a comment |
const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);
answered Apr 2 '18 at 6:50
CaseyCasey
1,10821433
2
While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.
– rollstuhlfahrer
Apr 2 '18 at 7:07
add a comment |
const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);
answered Apr 2 '18 at 6:50
CaseyCasey
1,10821433
2
While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.
– rollstuhlfahrer
Apr 2 '18 at 7:07
add a comment |
const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);
answered Apr 2 '18 at 6:50
CaseyCasey
1,10821433
const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);
answered Apr 2 '18 at 6:50
CaseyCasey
1,10821433
answered Apr 2 '18 at 6:50
CaseyCasey
1,10821433
answered Apr 2 '18 at 6:50
CaseyCasey
1,10821433
answered Apr 2 '18 at 6:50
CaseyCasey
1,10821433
1,10821433
2
While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.
– rollstuhlfahrer
Apr 2 '18 at 7:07
add a comment |
2
While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.
– rollstuhlfahrer
Apr 2 '18 at 7:07
2
2
While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.
– rollstuhlfahrer
Apr 2 '18 at 7:07
While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value.
– rollstuhlfahrer
Apr 2 '18 at 7:07
add a comment |
<script type="text/javascript">
var uri = window.location.toString();
if (uri.indexOf("?") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("?"));
window.history.replaceState({}, document.title, clean_uri);
}
</script>
put this code on head section
answered Jan 7 '16 at 16:58
Manigandan RaamanathanManigandan Raamanathan
311
add a comment |
<script type="text/javascript">
var uri = window.location.toString();
if (uri.indexOf("?") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("?"));
window.history.replaceState({}, document.title, clean_uri);
}
</script>
put this code on head section
answered Jan 7 '16 at 16:58
Manigandan RaamanathanManigandan Raamanathan
311
add a comment |
<script type="text/javascript">
var uri = window.location.toString();
if (uri.indexOf("?") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("?"));
window.history.replaceState({}, document.title, clean_uri);
}
</script>
put this code on head section
answered Jan 7 '16 at 16:58
Manigandan RaamanathanManigandan Raamanathan
311
<script type="text/javascript">
var uri = window.location.toString();
if (uri.indexOf("?") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("?"));
window.history.replaceState({}, document.title, clean_uri);
}
</script>
put this code on head section
answered Jan 7 '16 at 16:58
Manigandan RaamanathanManigandan Raamanathan
311
answered Jan 7 '16 at 16:58
Manigandan RaamanathanManigandan Raamanathan
311
answered Jan 7 '16 at 16:58
Manigandan RaamanathanManigandan Raamanathan
311
answered Jan 7 '16 at 16:58
Manigandan RaamanathanManigandan Raamanathan
311
311
add a comment |
add a comment |
You can do it as below:
history.replaceState({}, document.title, window.location.href.split('#')[0]);
answered Sep 23 '18 at 12:53
METALHEADMETALHEAD
313112
add a comment |
You can do it as below:
history.replaceState({}, document.title, window.location.href.split('#')[0]);
answered Sep 23 '18 at 12:53
METALHEADMETALHEAD
313112
add a comment |
You can do it as below:
history.replaceState({}, document.title, window.location.href.split('#')[0]);
answered Sep 23 '18 at 12:53
METALHEADMETALHEAD
313112
You can do it as below:
history.replaceState({}, document.title, window.location.href.split('#')[0]);
answered Sep 23 '18 at 12:53
METALHEADMETALHEAD
313112
answered Sep 23 '18 at 12:53
METALHEADMETALHEAD
313112
answered Sep 23 '18 at 12:53
METALHEADMETALHEAD
313112
answered Sep 23 '18 at 12:53
METALHEADMETALHEAD
313112
313112
add a comment |
add a comment |
Try the following:
window.history.back(1);
edited Jan 15 '16 at 15:03
josliber♦
37.3k1164100
answered Jul 13 '13 at 10:10
Vishal SharmaVishal Sharma
913
yeah its working thanx @Vishal Sharma
– Jimmy
Jul 27 '13 at 7:35
22
This doesn't answer the question if the user has come directly to the URL including the hash.
– nickb
Jan 5 '14 at 2:57
This trick is very useful when you just want create a link to previous page, but the link is hidden in bunch of js files.
– ValidfroM
Apr 15 '14 at 16:55
Exactly what I was looking for. This works perfectly to remove a hashtag just created by my web app in order to consume a value returned by a javasript function.
– user278859
Jun 7 '18 at 5:53
add a comment |
Try the following:
window.history.back(1);
edited Jan 15 '16 at 15:03
josliber♦
37.3k1164100
answered Jul 13 '13 at 10:10
Vishal SharmaVishal Sharma
913
yeah its working thanx @Vishal Sharma
– Jimmy
Jul 27 '13 at 7:35
22
This doesn't answer the question if the user has come directly to the URL including the hash.
– nickb
Jan 5 '14 at 2:57
This trick is very useful when you just want create a link to previous page, but the link is hidden in bunch of js files.
– ValidfroM
Apr 15 '14 at 16:55
Exactly what I was looking for. This works perfectly to remove a hashtag just created by my web app in order to consume a value returned by a javasript function.
– user278859
Jun 7 '18 at 5:53
add a comment |
Try the following:
window.history.back(1);
edited Jan 15 '16 at 15:03
josliber♦
37.3k1164100
answered Jul 13 '13 at 10:10
Vishal SharmaVishal Sharma
913
Try the following:
window.history.back(1);
edited Jan 15 '16 at 15:03
josliber♦
37.3k1164100
answered Jul 13 '13 at 10:10
Vishal SharmaVishal Sharma
913
edited Jan 15 '16 at 15:03
josliber♦
37.3k1164100
edited Jan 15 '16 at 15:03
josliber♦
37.3k1164100
edited Jan 15 '16 at 15:03
josliber♦
37.3k1164100
37.3k1164100
answered Jul 13 '13 at 10:10
Vishal SharmaVishal Sharma
913
answered Jul 13 '13 at 10:10
Vishal SharmaVishal Sharma
913
answered Jul 13 '13 at 10:10
Vishal SharmaVishal Sharma
913
913
yeah its working thanx @Vishal Sharma
– Jimmy
Jul 27 '13 at 7:35
22
This doesn't answer the question if the user has come directly to the URL including the hash.
– nickb
Jan 5 '14 at 2:57
This trick is very useful when you just want create a link to previous page, but the link is hidden in bunch of js files.
– ValidfroM
Apr 15 '14 at 16:55
Exactly what I was looking for. This works perfectly to remove a hashtag just created by my web app in order to consume a value returned by a javasript function.
– user278859
Jun 7 '18 at 5:53
add a comment |
yeah its working thanx @Vishal Sharma
– Jimmy
Jul 27 '13 at 7:35
22
This doesn't answer the question if the user has come directly to the URL including the hash.
– nickb
Jan 5 '14 at 2:57
This trick is very useful when you just want create a link to previous page, but the link is hidden in bunch of js files.
– ValidfroM
Apr 15 '14 at 16:55
Exactly what I was looking for. This works perfectly to remove a hashtag just created by my web app in order to consume a value returned by a javasript function.
– user278859
Jun 7 '18 at 5:53
yeah its working thanx @Vishal Sharma
– Jimmy
Jul 27 '13 at 7:35
yeah its working thanx @Vishal Sharma
– Jimmy
Jul 27 '13 at 7:35
22
22
This doesn't answer the question if the user has come directly to the URL including the hash.
– nickb
Jan 5 '14 at 2:57
This doesn't answer the question if the user has come directly to the URL including the hash.
– nickb
Jan 5 '14 at 2:57
This trick is very useful when you just want create a link to previous page, but the link is hidden in bunch of js files.
– ValidfroM
Apr 15 '14 at 16:55
This trick is very useful when you just want create a link to previous page, but the link is hidden in bunch of js files.
– ValidfroM
Apr 15 '14 at 16:55
Exactly what I was looking for. This works perfectly to remove a hashtag just created by my web app in order to consume a value returned by a javasript function.
– user278859
Jun 7 '18 at 5:53
Exactly what I was looking for. This works perfectly to remove a hashtag just created by my web app in order to consume a value returned by a javasript function.
– user278859
Jun 7 '18 at 5:53
add a comment |
You can replace hash with null
var urlWithoutHash = document.location.href.replace(location.hash , "" );
answered Sep 27 '13 at 6:04
Devang BhagdevDevang Bhagdev
3951613
1
The question asks "without causing the page to refresh", but this method does refresh the page. You should note this fact in your answer, so we don't all have to waste our time finding out firsthand that you're answering a different question than the one we're actually trying to get answered here.
– Vladimir Kornea
Jan 9 '15 at 0:41
It does not refresh the page.
– Ciprian
Jul 1 '16 at 10:08
add a comment |
You can replace hash with null
var urlWithoutHash = document.location.href.replace(location.hash , "" );
answered Sep 27 '13 at 6:04
Devang BhagdevDevang Bhagdev
3951613
1
The question asks "without causing the page to refresh", but this method does refresh the page. You should note this fact in your answer, so we don't all have to waste our time finding out firsthand that you're answering a different question than the one we're actually trying to get answered here.
– Vladimir Kornea
Jan 9 '15 at 0:41
It does not refresh the page.
– Ciprian
Jul 1 '16 at 10:08
add a comment |
You can replace hash with null
var urlWithoutHash = document.location.href.replace(location.hash , "" );
answered Sep 27 '13 at 6:04
Devang BhagdevDevang Bhagdev
3951613
You can replace hash with null
var urlWithoutHash = document.location.href.replace(location.hash , "" );
answered Sep 27 '13 at 6:04
Devang BhagdevDevang Bhagdev
3951613
answered Sep 27 '13 at 6:04
Devang BhagdevDevang Bhagdev
3951613
answered Sep 27 '13 at 6:04
Devang BhagdevDevang Bhagdev
3951613
answered Sep 27 '13 at 6:04
Devang BhagdevDevang Bhagdev
3951613
3951613
1
The question asks "without causing the page to refresh", but this method does refresh the page. You should note this fact in your answer, so we don't all have to waste our time finding out firsthand that you're answering a different question than the one we're actually trying to get answered here.
– Vladimir Kornea
Jan 9 '15 at 0:41
It does not refresh the page.
– Ciprian
Jul 1 '16 at 10:08
add a comment |
1
The question asks "without causing the page to refresh", but this method does refresh the page. You should note this fact in your answer, so we don't all have to waste our time finding out firsthand that you're answering a different question than the one we're actually trying to get answered here.
– Vladimir Kornea
Jan 9 '15 at 0:41
It does not refresh the page.
– Ciprian
Jul 1 '16 at 10:08
1
1
The question asks "without causing the page to refresh", but this method does refresh the page. You should note this fact in your answer, so we don't all have to waste our time finding out firsthand that you're answering a different question than the one we're actually trying to get answered here.
– Vladimir Kornea
Jan 9 '15 at 0:41
The question asks "without causing the page to refresh", but this method does refresh the page. You should note this fact in your answer, so we don't all have to waste our time finding out firsthand that you're answering a different question than the one we're actually trying to get answered here.
– Vladimir Kornea
Jan 9 '15 at 0:41
It does not refresh the page.
– Ciprian
Jul 1 '16 at 10:08
It does not refresh the page.
– Ciprian
Jul 1 '16 at 10:08
add a comment |
Here is another solution to change the location using href and clear the hash without scrolling.
The magic solution is explained here. Specs here.
const hash = window.location.hash;
history.scrollRestoration = 'manual';
window.location.href = hash;
history.pushState('', document.title, window.location.pathname);
NOTE: The proposed API is now part of WhatWG HTML Living Standard
answered Nov 29 '17 at 14:44
voscausavoscausa
7,95012046
add a comment |
Here is another solution to change the location using href and clear the hash without scrolling.
The magic solution is explained here. Specs here.
const hash = window.location.hash;
history.scrollRestoration = 'manual';
window.location.href = hash;
history.pushState('', document.title, window.location.pathname);
NOTE: The proposed API is now part of WhatWG HTML Living Standard
answered Nov 29 '17 at 14:44
voscausavoscausa
7,95012046
add a comment |
Here is another solution to change the location using href and clear the hash without scrolling.
The magic solution is explained here. Specs here.
const hash = window.location.hash;
history.scrollRestoration = 'manual';
window.location.href = hash;
history.pushState('', document.title, window.location.pathname);
NOTE: The proposed API is now part of WhatWG HTML Living Standard
answered Nov 29 '17 at 14:44
voscausavoscausa
7,95012046
Here is another solution to change the location using href and clear the hash without scrolling.
The magic solution is explained here. Specs here.
const hash = window.location.hash;
history.scrollRestoration = 'manual';
window.location.href = hash;
history.pushState('', document.title, window.location.pathname);
NOTE: The proposed API is now part of WhatWG HTML Living Standard
answered Nov 29 '17 at 14:44
voscausavoscausa
7,95012046
answered Nov 29 '17 at 14:44
voscausavoscausa
7,95012046
answered Nov 29 '17 at 14:44
voscausavoscausa
7,95012046
answered Nov 29 '17 at 14:44
voscausavoscausa
7,95012046
7,95012046
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f1397329%2fhow-to-remove-the-hash-from-window-location-url-with-javascript-without-page-r%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
3
Do you really want to do this? It'll cause a page refresh.
– seth
Sep 9 '09 at 3:08
7
Is it possible to do without a page refresh?
– Tom Lehman
Sep 9 '09 at 3:11
1
It is possible. AJAX history libraries deal with it. But it's not easy, and it has to be done differently for almost every browser. Not something you wanna get into.
– Gabriel Hurley
Sep 9 '09 at 3:14
Is there any conciderations with leaving a "#" behind other than a visual one?
– user29660
Aug 16 '16 at 10:55
Possible duplicate of Modify the URL without reloading the page
– PayteR
Sep 10 '17 at 12:53