Почему идет прокрутка страницы вверх?

Question

[Antibreez]

Есть ссылка-кнопка в коде, вызывающая поп-ап

<a class="button" href="#">Заблудились? Напишите нам!</a>

Вот код js для этой кнопки

var writeUs = document.querySelector(".contacts .button");

  writeUs.addEventListener("click", function (evt) {
    evt.preventDefault();
    popupMessage.classList.add("popup-show");
  });

Почему-то в браузере Edge при клике появляется поп-ап, но при этом страница прокручивается вверх. Не preventDefault должен с этим справляться? В других браузерах этого не происходит. Помогите, пожалуйста, понять, в чем причина.

Comments

[Ankhena]

Не удалось воспроизвести.
Выкладывайте пример в песочницу или ссылку на сайт.

[Antibreez]

Ankhena, спасибо за участие. вот ссылка https://codepen.io/antibreez/pen/KEVqQz
Проблема, как я уже понял в атрибуте href="#", если # заменить ссылкой, то прокрутки при клике на ссылку-кнопку нет.

[Ankhena]

Antibreez, у меня все равно не прыгает (да и не должен) ))
Хорошенько почистите кеш или попробуйте на другом компе.

Но зато вам бонус:
1. font-weight: 400px px лишние
2. <p footer-contacts> class забыли
3. type="submite" пишется submit
4. 2 шрифта с гугла подключаются одной ссылкой, а не двумя.

[Antibreez]

Ankhena, на другом компе у меня то же самое.
За бонус спасибо!) Я вчера как раз познакомился с валидатором и исправил это.

Answer 1

[Юпитер Макс]

в href 0 поставьте

<a class="button" href="#0"></a>

и можно убрать

evt.preventDefault();

Comments

[Antibreez]

Спасибо. Кстати, если вместо # будет реальная ссылка, то проблемы нет

Answer 2

[Алексей]

Попробуй return false; в конце обработчика события.