Bootstrap Scrollspy - Как получить выпадающий список scrollspy?

Question

Я не знаю, как объяснить это только словами - так что давайте начнем с изображением, показывая, что я хотел бы достичь с кодом:

Так в основном, то, что я хочу сделать:

1. Все разделы (анкеры) страницы должны быть в раскрывающемся списке.
2. Выпадающее меню должно работать как меню - нажатие на элемент должно выполняться (прокручивать) вас до определенного раздела.
3. При прокрутке страницы в раскрывающемся списке следует просмотреть/указать, какой раздел вы просматриваете в данный момент.

Мои знания/понимание о js очень ограничены, поэтому я мог бы пропустить очевидное при чтении документации для начальной загрузки. Но что бы я ни старался, кажется, я не могу получить раскрывающееся меню, чтобы указать, какой раздел в данный момент находится в точке просмотра браузеров.

Даже официальный пример не делает то, что я хочу выполнить, как вы можете видеть here. Это указывает только на то, что просматривается НЕКОТОРЫЙ элемент в раскрывающемся списке, а не конкретный элемент, который фактически просматривается.

Если я не могу выполнить это с помощью бутстрапа, есть ли другие способы?

Спасибо!

Answer 1

Вероятно, это немного поздно, но я имел эту проблему и как раз искал это на Google и нашел ответ :)

Scrollspy имеет фантастическое событие:

$('#myScrollspy').on('activate.bs.scrollspy', function() { 
// do something… 
}) 

На «сделать что-то» область, вы можете поймать элемент, который только что получил «активный» класс, получить его идентификатор и обновить раскрывающееся меню :)