69

I am trying to change a hashed URL (document.location.hash) with the replace method, but it doesn't work.

$(function(){
 var anchor = document.location.hash;
 //this returns me a string value like '#categories'

  $('span').click(function(){

     $(window).attr('url').replace(anchor,'#food');
     //try to change current url.hash '#categories'
     //with another string, I stucked here.
  });

});

I dont want to change/refresh page, I just want to replace URL without any responses.

Note: I don't want to solve this with a href="#food" solution.

BenMorel
  • 30,280
  • 40
  • 163
  • 285
Barlas Apaydin
  • 6,794
  • 10
  • 50
  • 81
  • 4
    Are you just trying to change the hash? `location.hash = '#food';` – Fabrício Matté Jul 21 '12 at 00:25
  • yes, with an another string like '#food' – Barlas Apaydin Jul 21 '12 at 00:26
  • `window` doesn't have an `url` attribute, `$(window).attr('url')` returns `undefined`. You misspelled `replace` as well and `undefined` does not have a replace method, and even if it was a string you aren't retuning it anywhere (it'd be just discarded). – Fabrício Matté Jul 21 '12 at 00:41
  • 3
    @FabrícioMatté good catch. It's great when "programmers" don't notice such errors. Apparently the debug console is a secret that only _some_ programmers know about... or is SO a remote error/debug log facility? ^^' – Spooky Jul 21 '12 at 01:47
  • rofl, +1 @Spooky but yeah, not everyone is very experienced with JS so I usually tell them to use Chrome's Dev Tools or [Firebug](https://getfirebug.com/), but as I figured OP was just showing an example of what he'd have tried, I only pointed out a couple reasons why it wouldn't work. `:P` – Fabrício Matté Jul 21 '12 at 01:50
  • @FabrícioMatté - "I only pointed out **a couple** reasons why it wouldn't work"... I laughed so hard. You're so kind :') – Spooky Jul 21 '12 at 01:53
  • Lol, I said "a couple" because my brain tries to stop compiling when it reaches a syntax error and I could not be mentioning 'em all. `x]` But OP's code tries to illustrate what he is trying to do, so it's worth a couple points. `:)` – Fabrício Matté Jul 21 '12 at 01:56
  • http://chat.stackoverflow.com/ – Barlas Apaydin Jul 21 '12 at 10:57
  • dude this is question website rigth? and i am asking questions, i can do simple mistakes, i didnt say that i am pro, what is your real problem @Spooky ? – Barlas Apaydin Jul 21 '12 at 12:16
  • being rude and snob wont take you anywhere @Spooky . – Barlas Apaydin Jul 21 '12 at 12:17
  • [chat.stackoverflow.com](http://chat.stackoverflow.com/) – Spooky Jul 21 '12 at 12:54

2 Answers2

130

Either use location or window.location instead of document.location as the latter is a non-standard.

window.location.hash = '#food';

This will replace the URL's hash with the value you set for it.

Reference

Fabrício Matté
  • 65,581
  • 23
  • 120
  • 159
  • +1 It seems the OP was simply unaware that this method doesn't "change/refresh page". – Spooky Jul 21 '12 at 00:30
  • Plugin? What is it supposed to do? – Fabrício Matté Jul 21 '12 at 00:30
  • @barlasapaydin By how your question currently stands, this is the only answer I can think of. If you update the question with more info I'll take another look. Meanwhile I'll grab something to eat. – Fabrício Matté Jul 21 '12 at 00:32
  • @barlasapaydin ensure that the code is being called and ensure that you navigate to a fresh instance of the page (remember you have a hash in your current URL, so remove it before refreshing). – Spooky Jul 21 '12 at 00:33
  • 2
    If you wish the change the hash within the URL when the user clicks an anchor tag, why not just use `Foo`? – Spooky Jul 21 '12 at 00:35
  • 2
    +1 Spooky, even though if he is developing a plugin, he may not be able to edit the page's source. – Fabrício Matté Jul 21 '12 at 00:36
  • That's a good point, Fab. Edit your post to include his code, with your single line added - I think that's what he's waiting for. – Spooky Jul 21 '12 at 00:40
  • @Spooky o really why i coundt think that !! dude i need to change it with this way.. otherwise i didnt ask this question. – Barlas Apaydin Jul 21 '12 at 00:41
  • @FabrícioMatté http://stackoverflow.com/questions/11338967/jquery-issue-on-extending-jquery-functionality/11339046#11339046 read this and be sure that i am not having problems with plguin. – Barlas Apaydin Jul 21 '12 at 00:43
  • @barlasapaydin I'm taking a look at your plugin, apparently you had a syntax error - [fiddle](http://jsfiddle.net/ult_combo/5yKr6/) what is it supposed to do again? Just move the links down? And is it related to this question somehow? – Fabrício Matté Jul 21 '12 at 00:50
  • @barlasapaydin Fab wasn't implying that you're having issues with a plugin - he was merely asking what your plugin's intentions are, so that he knows what the limits are (such as whether or not you have direct access to the HTML). – Spooky Jul 21 '12 at 00:51
  • okey, i have got cache problem. got fixed. thank you for your answer @FabrícioMatté – Barlas Apaydin Jul 21 '12 at 00:55
  • 1
    @barlasapaydin No problem, also http://jsfiddle.net/ult_combo/5yKr6/1/ (I edited your plugin slightly, not sure if that's what you asked me for anyway) – Fabrício Matté Jul 21 '12 at 00:59
  • 1
    Here's a cleaner and more well-commented version: [Fiddle](http://jsfiddle.net/ult_combo/5yKr6/3/). And off-topic, first downvote I have got in one of my upvoted answers so far, how cute `:)` (I'm not complaining about anonymous downvoters, but if you feel that I can improve my answer, then comment it). – Fabrício Matté Jul 21 '12 at 01:04
  • Removed the `href` anchors which @Spooky suggested due to OP's new question update, oh well. That was a very nice and quick thinking to solve it though, thanks Spooky. `=]` – Fabrício Matté Jul 21 '12 at 01:36
  • Thanks. I wish to point out that I upvoted your answer as soon as you posted it. Good job Fab :) – Spooky Jul 21 '12 at 01:47
  • Curiously `document.location.hash` worked for me whereas `window.location.hash` did not. – Blake Frederick Feb 06 '17 at 19:39
47

You may prefer the answer of this question.

The difference being that with history.replaceState() you don't scroll to the anchor, only replace it in the navigation bar. It's supported by all major browsers, source.

history.replaceState(undefined, undefined, "#hash_value")
Community
  • 1
  • 1
arc
  • 3,984
  • 4
  • 31
  • 40
  • 7
    This answer should be set as accepted - by using this method no change is made except the change of the hash value. This goes double, since the original question contains this condition: "I dont want to change/refresh page, I just want to replace URL without any responses." – Rudi Ørnhøj Apr 19 '18 at 14:07
  • 1
    Indeed this solution in great, especially if there is no need to add new history entry. I also noticed that # is need to be at the end of url this line work. – vpxfhu77 Jun 11 '18 at 12:09