Question

我的网址如下：http://example.com#something，如何在不导致页面刷新的情况下删除#something？

我尝试了以下解决方案：

window.location.hash = '';

但是，这不会从网址中删除哈希符号#。

Answer 1

现在可以解决这个问题。 HTML5 History API允许我们操纵位置栏以显示当前域中的任何URL。

function removeHash () { 
    history.pushState("", document.title, window.location.pathname
                                                       + window.location.search);
}

工作演示：http://jsfiddle.net/AndyE/ycmPt/show/

适用于IE 10中的Chrome 9，Firefox 4，Safari 5，Opera 11.50 和。对于不受支持的浏览器，您可以随时编写一个优雅降级的脚本，在可用的情况下使用它： / p>

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;
    }
}

所以你可以摆脱哈希符号，但不是在所有浏览器中。

_{注意：如果您要替换浏览器历史记录中的当前页面，请使用replaceState()代替pushState()。}

Answer 2

初步问题：

window.location.href.substr(0, window.location.href.indexOf('#'))

或

window.location.href.split('#')[0]

两者都将返回没有哈希值的URL或其后的任何内容。

关于您的修改：

对window.location的任何更改都会触发页面刷新。您可以在不触发刷新的情况下更改window.location.hash（尽管如果您的哈希值与页面上的ID匹配，窗口将跳转），但您无法摆脱哈希符号。选择哪个更糟糕......

最新的答案

关于如何在不牺牲的情况下做出正确答案（完全重新加载或在那里留下哈希标志）是down here。在这里留下这个答案，虽然是2009年的原始答案，而利用新浏览器API的正确答案是在1。5年后给出的。

Answer 3

（太多的答案是多余的和过时的。）现在最好的解决方案是：

history.replaceState(null, null, ' ');

Answer 4

简单而优雅：

history.replaceState({}, document.title, ".");  // replace / with . to keep url

Answer 5

要删除哈希，您可以尝试使用此功能

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);
    }
}

Answer 6

这也将删除尾随哈希。例如：http://test.com/123#abc - ＆gt; http://test.com/123

if(window.history.pushState) {
    window.history.pushState('', '/', window.location.pathname)
} else {
    window.location.hash = '';
}

Answer 7

const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);

Answer 8

以下怎么样？

window.location.hash=' '

请注意，我将散列设置为单个空格而不是空字符串。

将哈希值设置为无效锚点也不会导致刷新。如，

window.location.hash='invalidtag'

但是，我发现上述解决方案具有误导性。这似乎表明在给定位置上有一个具有给定名称的锚点，尽管它没有。同时，使用空字符串会导致页面移动到顶部，这有时是不可接受的。使用空格还可确保无论何时复制URL并为其添加书签和访问权限，页面通常都位于顶部，空格将被忽略。

而且，嘿，这是我在StackOverflow上的第一个答案。希望有人发现它有用并符合社区标准。

Answer 9

<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>

将此代码放在头部

Answer 10

您可以按照以下步骤进行操作：

history.replaceState({}, document.title, window.location.href.split('#')[0]);

Answer 11

function removeLocationHash(){
    var noHashURL = window.location.href.replace(/#.*$/, '');
    window.history.replaceState('', document.title, noHashURL) 
}

window.addEventListener("load", function(){
    removeLocationHash();
});

Answer 12

我认为，这样会更安全

    <body>

       <h1>Some content</h1>
      
    </body>

Answer 13

尝试以下方法：

window.history.back(1);

Answer 14

这是使用href更改位置并在不滚动的情况下清除哈希的另一种解决方案。

解释了神奇的解决方案here。规格here。

const hash = window.location.hash;
history.scrollRestoration = 'manual';
window.location.href = hash;    
history.pushState('', document.title, window.location.pathname);

注意：建议的API现在是WhatWG HTML Living Standard的一部分

Answer 15

根据上面给出的答案之一，使用这个：

var scrollV, scrollH
var loc = window.location;
scrollV = document.body.scrollTop;
scrollH = document.body.scrollLeft;
if ("pushState" in history) {
    history.pushState("", document.title, loc.pathname + loc.search);

    // Restore the scroll offset
    document.body.scrollTop = scrollV;
    document.body.scrollLeft = scrollH;

} else {
    loc.hash = "";

    // Restore the scroll offset
    document.body.scrollTop = scrollV;
    document.body.scrollLeft = scrollH;
}

Answer 16

您可以将hash替换为null

var urlWithoutHash = document.location.href.replace(location.hash , "" );

如何在没有页面刷新的情况下使用JavaScript从window.location（URL）中删除哈希？

17 个答案: