Как удалить хэш из окна.расположение (URL) с JavaScript без обновления страницы?

у меня есть URL, как:http://example.com#something, Как убрать #something, не вызывая обновления страницы?

Я попытался выполнить следующее решение:

window.location.hash = '';

однако это не удаляет хэш-символ # из URL.

259
fragment-identifier javascript window.location

13 ответов

первый вопрос:

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

или

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

оба вернут URL без хэша или чего-либо после него.

в отношении изменить:

изменения window.location вызовет обновление страницы. Вы можете изменить window.location.hash без запуска обновления (хотя окно будет прыгать, если ваш хэш-код совпадает с кодом на странице), но вы не можете избавиться от хэш-знак. Возьмите свой выбор, для которого хуже...

БОЛЬШИНСТВО ДО-ЧТОБЫ-ДАТА ОТВЕТА

правильный ответ о том, как это сделать, не жертвуя (либо полная перезагрузка, либо оставляя знак хэша там) -здесь. Оставив этот ответ здесь, хотя и в отношении оригинального в 2009 году, тогда как правильный, который использует новые API браузера, был дан 1,5 года спустя.

169

решение этой проблемы в настоящее время гораздо более достижимо. The HTML5 история API позволяет нам манипулировать панелью местоположения для отображения любого URL-адреса в текущем домене.

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

рабочая демо:http://jsfiddle.net/AndyE/ycmPt/show/

это работает в Chrome 9, Firefox 4, Safari 5, Opera 11.50 и в IE 10. Для неподдерживаемых браузеров вы всегда можете написать изящно деградирующий сценарий, который использует его, где это возможно:

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

495

простой и элегантный:

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

удалить хэш, вы можете попробовать использовать эту функцию

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

(слишком много ответов являются избыточными и устаревшими.) Лучшее решение сейчас таково:

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

Это также удалит конечный хэш. например: http://test.com/123#abc -> http://test.com/123

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

Как насчет следующих?

window.location.hash=' '

обратите внимание, что я устанавливаю хэш на один пробел, а не пустую строку.

установка хэша на недопустимый якорь также не вызывает обновления. Например,

window.location.hash='invalidtag'

но я нахожу выше решение ввести в заблуждение. Это, по-видимому, указывает на то, что на данной позиции есть якорь с заданным именем, хотя его нет. В то же время, используя пустая строка приводит к перемещению страницы наверх, что иногда может быть неприемлемо. Использование пробела также гарантирует, что всякий раз, когда URL-адрес копируется, закладывается и посещается снова, страница обычно находится вверху, а пространство игнорируется.

и, Эй, это мой первый ответ на StackOverflow. Надеюсь, кто-то найдет его полезным и он соответствует стандартам сообщества.

4
const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);
4
<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>

ставим этот код на головной секции

2

попробуйте следующее:

window.history.back(1);
1

вы можете заменить хэш на null

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

вот еще одно решение для изменения местоположения с помощью href и очистки хэша без прокрутки.

магическое решение объясняется здесь. Технические характеристики здесь.

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

Примечание: предлагаемый API теперь является частью WHATWG HTML Living Standard

0

вы можете сделать это, как показано ниже:

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

0