Как убрать якорь (знак решётки — #) в 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/# Можно ли его убрать без перезагрузки страницы..?

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

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

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

Решения вопроса 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

+2 ещё

Простой
Как сделать универсальную HTML-ссылку на яндекс карты?
- 1 подписчик
- 9 часов назад
- 67 просмотров
0

ответов
JavaScript

Простой
Как отправить данные JSON полученные в fetch в html таблицу?
- 1 подписчик
- 12 часов назад
- 58 просмотров
0

ответов
JavaScript

+1 ещё

Простой
Дергается анимация снега, почему и как исправить?
- 1 подписчик
- 19 часов назад
- 124 просмотра
0

ответов
JavaScript

+1 ещё

Простой
Как открыть CSS селектор при помощи onclick?
- 1 подписчик
- вчера
- 94 просмотра
1

ответ
JavaScript

Простой
Как исправить ошибку «Uncaught ReferenceError: $ is not defined» хотя jQuery подключен?
- 1 подписчик
- вчера
- 79 просмотров
2

ответа
JavaScript

+1 ещё

Простой
Как убрать экспоненциальную запись числа в input type=number?
- 1 подписчик
- вчера
- 90 просмотров
1

ответ
JavaScript

Простой
Как запустить проверку? try catch?
- 1 подписчик
- вчера
- 84 просмотра
1

ответ
JavaScript

Простой
Почему не работает проверка формы на валидность?
- 1 подписчик
- вчера
- 69 просмотров
1

ответ
JavaScript

Простой
Почему массив заполняется одним и тем же объектом?
- 1 подписчик
- 15 дек.
- 139 просмотров
0

ответов
JavaScript

+2 ещё

Простой
Как дебажить telegram mini app?
- 1 подписчик
- 15 дек.
- 163 просмотра
2

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

JavaScript FullStack разработчик

Rocket • Смоленск

от 80 000 до 130 000 ₽

Frontend-разработчик JavaScript

div. • Ставрополь

от 40 000 до 90 000 ₽

JavaScript FullStack developer

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

До 220 000 ₽

Отправка команды на открытие всех окон автомобиля Chery Tiggo 7 Pro

18 дек. 2024, в 03:28

16000 руб./за проект

Установить музыкальный софт

18 дек. 2024, в 01:04

5000 руб./за проект

Доработать в 1С (УТ 10.3) два функционала

17 дек. 2024, в 22:47

3000 руб./за проект

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 после закрытия модального окна?

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

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

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