Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   якорь без изменения урла (https://javascript.ru/forum/events/78131-yakor-bez-izmeneniya-urla.html)

redBaron 31.07.2019 10:00

якорь без изменения урла
 
можно ли перейти по юкорю на другой странице без изменения урла?

например у меня есть страница first.html со ссылкой
<div id="mylink"></div>

нужно перейти на страницу second.html к якорю #myanchor

js
document.getElementById('mylink').onclick = function(){
window.location.replace("http://second.html#myanchor");
}

как убрать #myanchor из загрузившейся страницы или вообще чтобы он не добавлялся?

Vlasenko Fedor 31.07.2019 11:18

вариант
window.addEventListener("popstate", function () {
       history.pushState('', '', location.pathname)
    });

Malleys 31.07.2019 14:25

Цитата:

Сообщение от redBaron
например у меня есть страница first.html со ссылкой
<div id="mylink"></div>

нужно перейти на страницу second.html к якорю #myanchor

js
document.getElementById('mylink').onclick = function(){
window.location.replace("http://second.html#myanchor");
}

Это не ссылка, ссылка делается намного проще!

страница first.html
<a href="second.html#myanchor">Go!</a>


Цитата:

Сообщение от redBaron
как убрать #myanchor из загрузившейся страницы

на странице second.html добавьте...
<script>

if(location.hash !== "") {
	sessionStorage.hash = location.hash;
	location.replace(location.pathname);
} else {
	if("hash" in sessionStorage) {
		document.querySelector(sessionStorage.hash).scrollIntoView();
		delete sessionStorage.hash;
	}
}

</script>


Цитата:

Сообщение от Poznakomlus
вариант
window.addEventListener("popstate", function () {
       history.pushState('', '', location.pathname)
    });

Событие popstate не происходит при загрузке страницы! Оно происходит при смене активного состояния в истории. А зачем вам в состоянии пустая строка? Кстати, url можно не указывать!

redBaron 31.07.2019 14:49

Цитата:

Сообщение от Malleys (Сообщение 510984)
if(location.hash !== "") {
sessionStorage.hash = location.hash;
location.replace(location.pathname);
} else {
if("hash" in sessionStorage) {
document.querySelector(sessionStorage.hash).scroll IntoView();
delete sessionStorage.hash;
}
}

ошибка
Cannot read property 'scrollIntoView' of null

Vlasenko Fedor 31.07.2019 15:37

Цитата:

Сообщение от Malleys
Событие popstate не происходит при загрузке страницы! Оно происходит при смене активного состояния в истории. А зачем вам в состоянии пустая строка? Кстати, url можно не указывать!

Абсолютно правильно, здесь не поможет и hashchange для этого достаточно одной строки для замены старой истории
location.hash && history.replaceState({}, '', location.pathname);

Malleys 31.07.2019 16:24

redBaron, а какой у вас браузер? В Chrome и FireFox работает...

redBaron 31.07.2019 16:33

странно, у меня тоже хром

Malleys 31.07.2019 16:59

Цитата:

Сообщение от redBaron
странно, у меня тоже хром

На всякий случай, мой пример... https://charm-launch.glitch.me/first.html

При нажатий на ссылку second.html#myanchor, откроется второй html-файл, и слово hello должно быть у верхнего края страницы!

redBaron 31.07.2019 17:12

Спасибо, за помощь. Попробую разобраться


Часовой пояс GMT +3, время: 16:51.