How to remove the hash from [removed] (URL) with JavaScript without page refresh?

前端 未结 16 2982
无人及你
无人及你 2020-11-22 02:53

I have URL like: http://example.com#something, how do I remove #something, without causing the page to refresh?

I attempted the following

相关标签:
16条回答
  • 2020-11-22 03:05

    You can replace hash with null

    var urlWithoutHash = document.location.href.replace(location.hash , "" );
    
    0 讨论(0)
  • 2020-11-22 03:06

    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);
        }
    }
    
    0 讨论(0)
  • 2020-11-22 03:08
    <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

    0 讨论(0)
  • 2020-11-22 03:08
    function removeLocationHash(){
        var noHashURL = window.location.href.replace(/#.*$/, '');
        window.history.replaceState('', document.title, noHashURL) 
    }
    
    window.addEventListener("load", function(){
        removeLocationHash();
    });
    
    0 讨论(0)
  • 2020-11-22 03:09

    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().

    0 讨论(0)
  • 2020-11-22 03:10

    I think, it would be more safe

    if (window.history) {
        window.history.pushState('', document.title, window.location.href.replace(window.location.hash, ''));
    } else {
        window.location.hash = '';
    }
    
    0 讨论(0)
提交回复
热议问题