Предотвращение прокрутки при нажатии на внутреннюю ссылку

У меня есть внутренняя ссылка на моей HTML-странице. При нажатии на внутреннюю ссылку происходит две вещи. 1. Страница прокручивается (перемещается) так, что цель ссылки находится вверху страницы. 2. url отражает внутреннюю ссылку, на которую нажимают, показывая /abc/#...

Я заметил, что порядок этих двух шагов также одинаков. т.е. hashchange запускается после прокрутки. Я хочу предотвратить прокрутку, но разрешить хэш-обмен. Если я напишу событие onclick, чтобы вернуть false (т.е. заблокировать его), то даже событие hashchange не будет запущено. Любые предложения, как еще это можно сделать?

1 ответ

Ты можешь использовать window.history.pushState() или же window.history.replaceState(), Эти методы не прокручиваются. К сожалению, Internet Explorer поддерживает history только начиная с версии 10.

Пример:

document.body.addEventListener('click', function(oEvent)
{
    if (oEvent.target.nodeName == 'A'
    &&  oEvent.target.hasAttribute('href')
    &&  oEvent.target.getAttribute('href').charAt(0) == '#')
    {
        oEvent.preventDefault();
        history.pushState(null, '', oEvent.target.getAttribute('href'));
    }
}, false);

PS. Моя страница должна работать с отключенными сценариями, поэтому я сохраняю идентификатор элемента, по крайней мере, до тех пор, пока не будет нажата какая-либо ссылка.

Другие вопросы по тегам