Выберите пункт в раскрывающемся списке и измените слово

Question

Извините, что плохо объясните это только в названии.

Что я хочу сделать, в основном чувствует себя как слайдер. Он должен выглядеть следующим образом: http://screencast.com/t/9q5uQlYBoViD (бутстрап).

Однако выпадающее название должно изменяться в соответствии с выбором. Например, Я нажимаю на раскрывающийся список, я нажимаю на второй элемент, и выпадающий заголовок (в изображении под названием «Раскрывающийся список 2») изменяется и становится именем элемента, на который я нажал.

Моя цель это создать что-то вроде: Просмотр контента для: Погода Пользователь может изменить от погоды на спорт, новости и т.д., в которых я буду получать нужное содержимое из БД и т.д.

Из документов bootstrap он не говорит, как я могу это сделать. Как я могу?

Благодаря

Answer 1

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

$(".dropdown-menu li a").click(function(){ 
    $(".btn:first-child").html($(this).text()+' <span class="caret"></span>'); 
}); 

Вот демо: Bootply