Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 27
  1. #1
    New Coder
    Join Date
    Dec 2007
    Posts
    96
    Thanks
    8
    Thanked 1 Time in 1 Post

    delete hash from address bar

    Hi everyone,

    I'm trying to delete hash from the address bar all day long. but I couldn't solve it.

    I have tried many things like
    Code:
    document.location.hash = "";
    But it didn't work.

    the only thing that worked
    Code:
    document.location.hash="#";
    But it makes the page scrolls up to the top.

    does anybody have a solution??

  • #2
    Smokes a Lot
    Join Date
    Jul 2003
    Location
    CA, USA
    Posts
    1,594
    Thanks
    5
    Thanked 20 Times in 20 Posts
    Are you talking about the hash (#) that gets appended to the url when you click on a javascript link?

    Something like:
    Code:
    <a href="#" onclick="someFunction();">Do some javascript thing</a>
    What's happening:

    When the user clicks the link, the javascript runs, but the user is also brought to the page in the href of the anchor tag. To prevent this, you have to return false after the javascript executes. This tells the browser to stop after the code runs and not follow the link:

    ex:

    Code:
    <a href="#" onclick="someFunction();return false;">Do some javascript thing</a>
    Basscyst
    Helping to build a bigger box. - Adam Matthews

  • #3
    New Coder
    Join Date
    Dec 2007
    Posts
    96
    Thanks
    8
    Thanked 1 Time in 1 Post
    thats not my problem. my question is:
    How can I remove the hash (with its #) without making the page scrolls up to the top.
    Because i'm developing an ajax application and it's too noisy to scroll the page down after clicking a link.

  • #4
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    I'm uncertain about your desire, but when this works:
    Code:
    document.location.hash="#";
    ...but makes your page scrolls to the top, then why not add:
    Code:
    document.location.hash="#";
    return false; // Cancel any event from this point forward
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #5
    New Coder
    Join Date
    Dec 2007
    Posts
    96
    Thanks
    8
    Thanked 1 Time in 1 Post
    I already have. but it scrolls anyway

  • #6
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is a quirck/bug with IE. If you set window.location.hash = "", it actually gets set to "#" so the URL becomes "http://server/page.html#" and jumps to the top.
    Code:
    function setBlankHash() {
        window.location.hash = "";
    }
    In firefox, you can just set window.location.hash = "" and the URL will be clean ("http://server/page.html"). The only way I know of to remove the hash in IE is to explicitly set the window.location:
    Code:
    function setBlankHash2() {
        window.location = window.location.href.replace( /#.*/, "");
    }
    At which point the entire page reloads.

    So you either deal with the page jumping to the top, or a page reload. It looks like with IE, once the hash is set it'll never be empty after that.

    The only workaround I see is that you can set the hash to a dummy value (page.html#none). Just make sure that the dummy value is not used for any anchors on the page, or the page will jump to that.

    If anyone finds a way to do this, please post!

  • #7
    New Coder
    Join Date
    Dec 2007
    Posts
    96
    Thanks
    8
    Thanked 1 Time in 1 Post
    Thanks jumpfroggy, I appreciate your first post was a useful reply for me.
    Thats exactly what I wanna know.
    Actually it is not just an IE bug. Opera and firefox behave in the same way.
    I guess, I'm gonna stick with #none for now until a solution is found.

    A new issue found in opera. if the hash was url like this: ...php#link.php?action=show
    opera strips out the parameters and the hash becomes like this: ..php#link.php

    maybe its for security. I don't know??!!
    Any comments??

  • #8
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by skmd View Post
    Thanks jumpfroggy, I appreciate your first post was a useful reply for me.
    Thats exactly what I wanna know.
    Actually it is not just an IE bug. Opera and firefox behave in the same way.
    Could you clarify how the hash is getting into the URL initially? It may be possible to eliminate it immediately then scroll to the required position via script.

  • #9
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by skmd View Post
    Thanks jumpfroggy, I appreciate your first post was a useful reply for me.
    NP.
    Actually it is not just an IE bug. Opera and firefox behave in the same way.
    Yeah, I just tested firefox and it also jumps to the top. I thought it didn't since I remembered that it does not add the "#" to the hash, but the jumping still screws things up.

    A new issue found in opera. if the hash was url like this: ...php#link.php?action=show
    opera strips out the parameters and the hash becomes like this: ..php#link.php
    maybe its for security. I don't know??!!
    Any comments??
    Ugh, sounds like a security-ish bug. I haven't seen other browsers do it, but it sounds like a horrible thing for a browser to do. They just don't like making our lives easy, do they?

    Quote Originally Posted by Arty Effem View Post
    Could you clarify how the hash is getting into the URL initially? It may be possible to eliminate it immediately then scroll to the required position via script.
    For my app, I set the URL's hash to reflect the current AJAX state. When I want to remove the hash, there really isn't any way to do so because of the bug in this post. I'm not sure what the OP's reason is, could be different.

  • #10
    New Coder
    Join Date
    Dec 2007
    Posts
    96
    Thanks
    8
    Thanked 1 Time in 1 Post
    I'm not sure what the OP's reason is, could be different.
    No, its almost the same. expect that the hash contains a url.
    I was working in the past 2 days on jQuery plugin. It was originally coded for my last project. And I thought it may be useful for beginner coders. (check the examples to understand what I was trying to do)
    http://max.jsrhost.com/ajaxify-jquery-plugin/
    My last project was relying on:
    Code:
    document.location.hash="#";
    But its owner called me back to fix this issue. now it uses:
    Code:
    document.location.hash="#none";
    as this is the best solution found so far.
    Last edited by skmd; 10-04-2008 at 11:05 PM.

  • #11
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by skmd View Post
    No, its almost the same. expect that the hash contains a url.
    I'm still not clear. Does either of these describe your exact requirement?

    1) When a page with a #anchorName in its URL loads, I want to remove the #anchorName from the address bar but keep the position of the page at that anchor.

    2) When an internal link is clicked, I want to scroll to that anchor position but not have the #anchorName appear in the address bar.

  • #12
    New Coder
    Join Date
    Dec 2007
    Posts
    96
    Thanks
    8
    Thanked 1 Time in 1 Post
    Quote Originally Posted by Arty Effem View Post
    I'm still not clear. Does either of these describe your exact requirement?

    1) When a page with a #anchorName in its URL loads, I want to remove the #anchorName from the address bar but keep the position of the page at that anchor.

    2) When an internal link is clicked, I want to scroll to that anchor position but not have the #anchorName appear in the address bar.
    May be (1) is the nearest. But not exactly.
    I need to insert hash and remove it based on some events.
    its simply like this:
    Code:
    <a href="#hash">Insert hash</a>
    And
    Code:
    <a href="#none">Remove hash</a>
    OR
    Code:
    <a href="" onclick="document.location.hash="#none";">Remove hash</a>
    The question is : Can I replace document.location.hash="#none"; with something that really removes the hash from the address bar after setting it?

  • #13
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by skmd View Post
    May be (1) is the nearest. But not exactly.
    I need to insert hash and remove it based on some events.
    its simply like this:
    Code:
    <a href="#hash">Insert hash</a>
    And
    Code:
    <a href="#none">Remove hash</a>
    OR
    Code:
    <a href="" onclick="document.location.hash="#none";">Remove hash</a>
    The question is : Can I replace document.location.hash="#none"; with something that really removes the hash from the address bar after setting it?
    From your description it looks like the second scenario I suggested applies, not the first. The following function can be called by a link to jump to the anchor in its href, without applying a hash to the URL. The usage is:

    <a href='#myAnchor' onclick='return anchorJump("myAnchor")'>middle</a>
    - or -
    <a href='#myAnchor' onclick='return anchorJump(this.href)'>middle</a>
    Code:
    <script type='text/javascript'>
    
    function anchorJump( anchor )
    {
      var targAnchor=null, anchorID=anchor.replace(/.*#([^\?]+).*/,'$1');   
       
      if( !(targAnchor=document.getElementById( anchorID )) )
       for(var i=0, found=false, da=document.anchors, len=da.length; i<len && !targAnchor; i++)
        targAnchor = (da[i].name==anchorID ? da[i] : null); 
      
      if(targAnchor)  
      {
       disp=getElemOffset(targAnchor);
       window.scrollTo(disp.x, disp.y);
      }
      else
       alert('Did not find anchor/element "'+anchorID+'"');
     
      function getElemOffset(elem)
      {
       var left = !!elem.offsetLeft ? elem.offsetLeft : 0;
       var top = !!elem.offsetTop ? elem.offsetTop : 0;
      
       while((elem = elem.offsetParent))
       { 
        left += !!elem.offsetLeft ? elem.offsetLeft : 0;
        top += !!elem.offsetTop ? elem.offsetTop : 0;
       }
      
       return {x:left, y:top};  
      }
    
     return false; 
    }
    </script>
    Does this address the problem?

  • #14
    New Coder
    Join Date
    Dec 2007
    Posts
    96
    Thanks
    8
    Thanked 1 Time in 1 Post
    Thank you Arty Effem for your try. but I think you haven't got it yet.
    We are using the hash to reflect the ajax status. Just saving some information in it. Actually The anchors we use doesn't exists. So we don't want the page to scroll.

    The "jumping" thing that we were talking about: we tried to set it empty like
    Code:
    document.location.hash="#";
    But in this way, the browser scrolls the page to the top which is actually annoying to the reader.

  • #15
    Banned
    Join Date
    May 2006
    Location
    England
    Posts
    664
    Thanks
    0
    Thanked 84 Times in 84 Posts
    Quote Originally Posted by skmd View Post
    We are using the hash to reflect the ajax status. Just saving some information in it. Actually The anchors we use doesn't exists. So we don't want the page to scroll.

    The "jumping" thing that we were talking about: we tried to set it empty like
    Code:
    document.location.hash="#";
    But in this way, the browser scrolls the page to the top which is actually annoying to the reader.
    Any change to the hash is going to scroll the document and trying to delete it will cause a reload.
    Why is it necessary to store data in the hash value as opposed to a variable?
    It would be much easier if you'd explain exactly what you're doing instead of expecting everyone to guess.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •