Удаление фрагмента по URL-адресу с помощью JavaScript w/out, вызывающего перезагрузку страницы
Фон: У меня есть HTML-страница, которая позволяет вам развернуть определенный контент. Поскольку для такого расширения нужно загружать только небольшие части страницы, это делается с помощью JavaScript, а не путем перехода на новую страницу URL/HTML. Однако в качестве бонуса пользователь может постоянно ссылаться на такие расширенные разделы, то есть отправлять кому-то еще URL-адрес, например
http://example.com/#foobar
и немедленно открыть категорию "foobar" для этого другого пользователя. Это работает с использованием parent.location.hash = 'foobar', так что часть в порядке.
Теперь вопрос: Когда пользователь закрывает такую категорию на странице, я хочу снова очистить фрагмент URL-адреса, т.е. http://example.com/#foobar в http://example.com/, чтобы обновить отображение постоянной ссылки. Однако при использовании parent.location.hash = ''
происходит перезагрузка всей страницы (например, в Firefox 3), чего я бы хотел избежать. Использование window.location.href = '/#'
не приведет к перезагрузке страницы, но оставляет URL-адрес несколько неуловимого вида "#". Итак, есть ли способ в популярных браузерах JavaScript - удалить привязку URL, включая знак "#", не вызывая обновление страницы?
Ответы
Ответ 1
Как уже упоминалось, replaceState в HTML5 можно использовать для удаления фрагмента URL.
Вот пример:
// remove fragment as much as it can go without adding an entry in browser history:
window.location.replace("#");
// slice off the remaining '#' in HTML5:
if (typeof window.history.replaceState == 'function') {
history.replaceState({}, '', window.location.href.slice(0, -1));
}
Ответ 2
Поскольку вы контролируете действие по хэш-значению, почему бы просто не использовать токен, который означает "ничего", например "#_" или "#default".
Ответ 3
Извините, но ответа нет, если опустошение location.hash не выполняет задачу! -)
Ответ 4
Вы можете использовать блестящие новые методы HTML5 window.history.pushState
и replaceState
, как описано в ASCIIcasts 246: Состояние истории AJAX и в блоге GitHub. Это позволяет вам изменить весь путь (внутри одного и того же хоста происхождения), а не только фрагмент. Чтобы попробовать эту функцию, просмотрите репозиторий GitHub с помощью последнего браузера.
Ответ 5
Существует также другой вариант вместо использования хэша,
вы можете использовать javascript: void(0);
Пример: <a href="javascript:void(0);" class="open_div">Open Div</a>
Я думаю, это также зависит от того, когда вам нужна эта ссылка, поэтому вам лучше проверить следующие ссылки:
Как его использовать: http://www.brightcherry.co.uk/scribbles/2010/04/25/javascript-how-to-remove-the-trailing-hash-in-a-url/
или проверить дебаты о том, что здесь лучше: Какой & href "значение, которое я должен использовать для ссылок на JavaScript," "или" javascript: void (0)"?
Ответ 6
Поэтому используйте
parent.location.hash = ''
первый
то do
window.location.href=window.location.href.slice(0, -1);
Ответ 7
Поместите этот код в головной блок.
<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>
Ответ 8
$(document).ready(function() {
$(".lnk").click(function(e) {
e.preventDefault();
$(this).attr("href", "stripped_url_via_desired_regex");
});
});
Ответ 9
Как говорили другие, вы не можете этого сделать. Плюс... серьезно, поскольку jQuery Ajaxy автор - я уже много лет развертывал полные веб-сайты ajax - и я могу гарантировать, что у конечного пользователя нет когда-либо жаловались или, возможно, когда-либо даже замечали, что происходит эта хеш-игра, пользователю все равно, пока она работает, и получая то, за что они пришли.
Правильное решение, хотя это HTML5 PushState/ReplaceState/PopState;-), которому больше не нужен идентификатор фрагментации:
https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
Для проекта, совместимого с HTML5 и HTML4, который поддерживает эту функциональность состояния HTML5, https://github.com/browserstate/History.js: -)