Не срабатывает preventDefault для ссылки

При клике на ссылку должно открываться модальное окно и сраница не должна перезагружаться, но при клике в середине страницы открывается модальное окно и почему-то страница за ним перескакивает на самый верх

<a href="#modal" class="more-info modal-link">узнать больше</a>

<div id="modal" class="modal">
  <div class="modal-body">
    <div class="modal-content">
      <a href="#" class="modal-close">
        <img src="img/close.png" alt="X">
      </a>
    </div>
  </div>
</div>

const modalLinks = document.querySelectorAll('.modal-link')

if (modalLinks.length > 0) {
  for (let i = 0; i < modalLinks.length; i++) {
    const modalLink = modalLinks[i]
    modalLink.addEventListener('click', function(e) {
      const modalName = modalLink.getAttribute('href').replace('#', '')
      const curModal = document.getElementById(modalName)
      modalOpen(curModal)
      e.preventDefault()
    })
  }
}

function modalOpen(curModal) {
  if (curModal && unlock) {
    const modalActive = document.querySelector('.modal.open')
    if (modalActive) {
      modalClose(modalActive, false)
    } else {
      bodyLock()
    }

    curModal.classList.add('open')
    curModal.addEventListener('click', function(e) {
      if (!e.target.closest('.modal-content')) {
        modalClose(e.target.closest('.modal'))
      }
    })
  }
}