Как удалить хэш из окна.расположение (URL) с JavaScript без обновления страницы?
у меня есть URL, как:http://example.com#something
, Как убрать #something
, не вызывая обновление страницы?
Я попытался следующее решение:
window.location.hash = '';
однако, это не удаляет хэш-символ #
из URL-адреса.
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 года спустя.
решение этой проблемы в настоящее время гораздо более доступно. Элемент HTML5 History 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()
.
простой и элегантный:
history.replaceState({}, document.title, "."); // replace / with . to keep url
удалить хэш, вы можете попробовать использовать эту функцию
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); } }
(слишком много ответов являются избыточными и устаревшими.) Лучшее решение сейчас таково:
history.replaceState(null, null, ' ');
это также удалит конечный хэш. например: http://test.com/123#abc -> http://test.com/123
if(window.history.pushState) { window.history.pushState('', '/', window.location.pathname) } else { window.location.hash = ''; }
Как насчет следующих?
window.location.hash=' '
обратите внимание, что я устанавливаю хэш в один пробел, а не пустую строку.
установка хэша на недопустимый якорь также не вызывает обновления. Например,
window.location.hash='invalidtag'
но, я нахожу выше решение, чтобы ввести в заблуждение. Это, по-видимому, указывает на то, что на данной позиции есть якорь с заданным именем, хотя его нет. В то же время, используя пустая строка заставляет страницу двигаться вверх, что иногда может быть неприемлемо. Использование пробела также гарантирует, что всякий раз, когда URL-адрес копируется и закладывается и посещается снова, страница обычно будет находиться вверху, а пространство будет игнорироваться.
и, Эй, это мой первый ответ на StackOverflow. Надеюсь, кто-то найдет его полезным, и он соответствует стандартам сообщества.
const url = new URL(window.location); url.hash = ''; history.replaceState(null, document.title, url);
<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>
ставим этот код на головной секции
вы можете заменить хэш на null
var urlWithoutHash = document.location.href.replace(location.hash , "" );
вот еще одно решение, чтобы изменить местоположение с помощью 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