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

我的URL是：

http://example.com#something

，如何在不刷新页面的情况下删除

#某些内容

我尝试了以下解决方案：

window.location.hash = '';

---

但是，这不会从URL中删除哈希符号。

初始问题：

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

或

两者都将返回URL，但不包含哈希或其后的任何内容

关于您的编辑：

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

对

窗口位置的任何更改都将触发页面刷新。您可以在不触发刷新的情况下更改
window.location.hash
（尽管如果您的hash与页面上的id匹配，窗口将跳转），但无法删除hash符号。你选哪个更糟

最新答案

关于如何在不牺牲（完全重新加载或保留哈希符号）的情况下执行此操作的正确答案是。在这里留下这个答案是关于2009年的原始答案，而1.5年后给出了利用新浏览器API的正确答案。
解决这个问题现在更容易实现。允许我们操纵位置栏来显示当前域中的任何URL

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

工作演示：

这适用于Chrome9、Firefox4、Safari5、Opera11.50和IE10。对于不受支持的浏览器，您始终可以编写一个优雅的降级脚本，在可用的情况下使用它：

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（）
尝试以下操作：

window.history.back(1);

您可以将哈希替换为null

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

简约典雅：

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

下面呢

window.location.hash=''

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


将哈希设置为无效的锚点也不会导致刷新。比如,

window.location.hash='invalidtag'

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

这是我关于StackOverflow的第一个答案。希望有人觉得它有用并且符合社区标准。

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

var uri=window.location.toString（）；
如果（uri.indexOf（“？”）大于0）{
var clean_uri=uri.substring（0，uri.indexOf（“？”）；
window.history.replaceState（{}，document.title，clean_uri）；
}

将此代码放在头部分
这也将删除尾部散列。
例：->

要删除哈希，可以尝试使用此函数

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

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

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

注意：建议的API现在是WhatWG HTML生活标准的一部分（太多的答案是多余的和过时的）。现在最好的解决方案是：

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

您可以按以下方式进行操作：

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

我想，这样会更安全

if (window.history) {
    window.history.pushState('', document.title, window.location.href.replace(window.location.hash, ''));
} else {
    window.location.hash = '';
}

根据上面给出的答案之一，使用以下方法：

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

你真的想这么做吗？这将导致页面刷新。是否可以不刷新页面？这是可能的。AJAX历史库处理它。但这并不容易，而且几乎每个浏览器都必须采用不同的方式。不是你想进入的东西。除了视觉上的“#”之外，在后面留下一个“#”有什么好处吗？这可能是完全错误的，你可以更改window.location.hash，它不会触发刷新。@Evgeny——这就是我的答案。我明确地说，更改window.location.hash不会触发刷新。“您可以在不触发刷新的情况下更改window.location.hash（尽管如果您的哈希与页面上的id匹配，窗口将跳转）”。不重新加载页面-这是问题所在。这不是答案，因为它需要/强制重新加载页面！也觉得不应该是✓回答这不是OP问题的答案。请使用此行确保不会丢失查询字符串：history.pushState（“”，document.title，window.location.pathname+window.location.search）@菲尔：谢谢你指出这一点，我已经相应地更新了答案。我太习惯使用漂亮的URL了。对于旧版本的IE，似乎需要使用document.documentElement而不是document.body。看到这个答案了吗？我建议使用replaceState而不是pushState，这样就不会在浏览器历史记录中创建额外的条目了。@santiagoarizti：你说得对，我刚刚得出了相同的结论。我没有正确地检查我（7年前！）编写的代码，没有注意到在删除散列时我也在切换按钮的状态。由于您是手动更改散列，我想您可以自己触发事件。如果用户直接访问包含散列的URL，这并不能回答问题。当您只想创建指向上一页的链接时，此技巧非常有用，但链接隐藏在一堆js文件中。这正是我想要的。这非常适用于删除我的web应用程序刚刚创建的hashtag，以便使用javasript函数返回的值。问题是“不会导致页面刷新”，但此方法确实会刷新页面。你应该在回答中注意到这一事实，这样我们就不必浪费时间直接发现你回答的问题与我们在这里试图得到答案的问题不同。它不会刷新页面。它不会刷新页面，因为它不会更新U
history.replaceState({}, document.title, window.location.href.split('#')[0]);

$(window).on('hashchange', function (e) {
    history.replaceState('', document.title, e.oldURL);
});

if (window.history) {
    window.history.pushState('', document.title, window.location.href.replace(window.location.hash, ''));
} else {
    window.location.hash = '';
}

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

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

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