Как убрать якорь (знак решётки — #) в URL после закрытия модального окна?

Question

Player_ABC @Player_ABC

JavaScript

Как убрать якорь (знак решётки — #) в URL после закрытия модального окна?

<body>
						<div id="auth">
							<div id="window">
								<h1 style="padding: 8px 0px 15px 0px">Авторизация</h1>
								<a class="close" href="#"></a>
								<button onclick="location.href='URL'" class="button-vkontakte">ВКонтакте</button>
								<br>
								<button onclick="location.href='URL'" class="button-facebook">Facebook</button>
								<br>
								<button onclick="location.href='URL'" class="button-google">Google</button>
								<br>
								<p style="margin: 10px">Авторизуясь через социальную сеть вы даёте согласие на обработку вашей публичной информации.</p>
							</div>
						</div>

Есть данный HTML код. При открытии #auth на странице, выходит модальное окно с выбором авторизации, в углу есть крестик для закрытия этого окна. После закрытия в URL остаётся знак решётки... Просто blablabla.com/# Можно ли его убрать без перезагрузки страницы..?

Вопрос задан более трёх лет назад
380 просмотров

Комментировать

Подписаться 1 Простой Комментировать

Помогут разобраться в теме Все курсы

Яндекс Практикум

Фронтенд-разработчик

10 месяцев

Далее
Skillfactory

Профессия Веб-разработчик

12 месяцев

Далее
Нетология

Fullstack-разработчик на Python + нейросети

20 месяцев

Далее

Решения вопроса 2

21 комментарий

Player_ABC @Player_ABC Автор вопроса

Не помогло.. Всё так же остаётся эта решётка...

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Он ни то что не убрал, а просто из начала переставил его в конец :D

Написано более трёх лет назад
Tim @Tim-A-2020

Player_ABC, покажи код

Написано более трёх лет назад
Tim @Tim-A-2020

Player_ABC, что значит из начала в конец переставил? Покажи какой url

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Tim, 195.22.152.205 Во

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Tim, В коде пробовал в onclick вшить history.pushState(null, null, location.href.replace('#', '')); вот и получилось что местами поменялось

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Tim, В отдельный js файл вшивал.. (в jqueri втсавил :D)

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Tim, Или я кажется не так понял куда вставлять history.pushState('', document.title, window.location.pathname);

Написано более трёх лет назад

Tim @Tim-A-2020

Player_ABC, для вашего случая

var modal = document.querySelector('#auth')
document.addEventListener('click', function(event) {
    event.preventDefault();
    if (event.target.hash && event.target.hash.includes('auth')) {
        modal.style.display = "block";
    } else if (event.target.classList.contains('close')) {
        modal.style.display = "none";
    }
})

Написано более трёх лет назад

Player_ABC @Player_ABC Автор вопроса

Tim, Я это могу в отдельный js файл засунуть?

Написано более трёх лет назад
Tim @Tim-A-2020

Player_ABC, да

Написано более трёх лет назад
Tim @Tim-A-2020

Player_ABC, файл скрипта перед закрывающим тегом body

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Tim,

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Tim, Благодраю, а запуск его через onclick..?

Написано более трёх лет назад
Tim @Tim-A-2020

Player_ABC, нет. там уже висит событие

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Tim, А, всё, сделал :) Благодарю вас!

Написано более трёх лет назад
Player_ABC @Player_ABC Автор вопроса

Tim, А после его закрытия не могу взаимодействовать с другими кнопками :D

Написано более трёх лет назад

Tim @Tim-A-2020

Player_ABC, замените

var modal = document.querySelector('#auth')
modal.addEventListener('click', function(event) {
    event.preventDefault();
    modal.style.display = "block";
})
document.querySelector('.close').addEventListener('click', function(event) {
    event.preventDefault();
    modal.style.display = "none";
})

Написано более трёх лет назад

Player_ABC @Player_ABC Автор вопроса

Tim, Заработали, но теперь не закрывается окно модальное(

Написано более трёх лет назад

Tim @Tim-A-2020

Player_ABC,

var modal = document.querySelector('#auth');
document.querySelector('.auth a').addEventListener('click', function(event) {
    event.preventDefault();
     modal.style.display = "block";
})
document.querySelector('.close').addEventListener('click', function(event) {
    event.preventDefault();
     modal.style.display = "none";
})

Написано более трёх лет назад

Player_ABC @Player_ABC Автор вопроса

Tim, Благодарю :)

Написано более трёх лет назад

2 комментария

Пригласить эксперта

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы

JavaScript

Простой
Как создать рисунок из PHP в Fabric.js?
- 2 подписчика
- 28 окт.
- 85 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Какой скрипт загружает меню в Ютуб?
- 2 подписчика
- 27 окт.
- 162 просмотра
2

ответа
JavaScript

Простой
Как работать с разрозненными данными?
- 1 подписчик
- 21 окт.
- 218 просмотров
2

ответа
JavaScript

+1 ещё

Простой
Неправильно работает crypto.subtle.deriveKey в Firefox, баг или мой косяк?
- 2 подписчика
- 16 окт.
- 130 просмотров
0

ответов
JavaScript

Простой
Как подгружать xml с перерисовкой таблицы?
- 3 подписчика
- 14 окт.
- 189 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Как решить задачку из контеста?
- 1 подписчик
- 13 окт.
- 255 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Есть ли js-библиотека для офлайн-распознавания русской речи?
- 1 подписчик
- 12 окт.
- 181 просмотр
2

ответа
JavaScript

Простой
Почему не работает в консоли setTimeout?
- 1 подписчик
- 11 окт.
- 341 просмотр
1

ответ
JavaScript

Простой
Как прочитать ответ сервера после отправки формы?
- 2 подписчика
- 27 сент.
- 302 просмотра
1

ответ
JavaScript

+2 ещё

Простой
Как менять картинки у карточки в списке товаров?
- 4 подписчика
- 22 сент.
- 356 просмотров
1

ответ
Показать ещё Загружается…

Web-разработчик/WordPress программист (Full-stack)

JustBusiness • Санкт-Петербург

от 130 000 до 150 000 ₽

Верстальщик / фронтендер для браузерного расширения

DevTeam.Space

от 1 000 до 2 000 $

React разработчик

ITK academy • Нижний Новгород

от 50 000 до 90 000 ₽

Answer 1 · 2020-12-26 08:58:31

По идее там висит какой то обработчик и там уже можно отменить действие по умолчанию.
Самый простой вариант на js

history.pushState(null, null, location.href.replace('#', ''));

Отмена действий по умолчанию

document.querySelector('.close').addEventListener('click', event => event.preventDefault());

Answer 2 · 2020-12-26 11:44:46

xmoonlight @xmoonlight

https://sitecoder.blogspot.com

href="#"Уберите эту ДИЧЬ!
Есть событие onclick(), его и используйте.

Ответ написан более трёх лет назад

2 комментария

Как убрать якорь (знак решётки — #) в URL после закрытия модального окна?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт