Javascript 在下拉列表中选择项并更改单词

很抱歉在标题中解释得很糟糕

我想做的基本上感觉像一个滑块。应该是这样的： （引导）

但是，下拉标题应根据所选内容进行更改。 例如单击下拉列表，单击第二个项目，下拉列表标题（在名为“dropdown 2”的图像中）将更改，并成为我单击的项目的名称

我的目标是建立类似于： 查看内容：天气 用户可以改变天气，体育，新闻等，我会从数据库等获取正确的内容

从bootstrap的文档中，它没有告诉我如何做到这一点。我该怎么办

---

谢谢

我不知道您尝试了什么代码，但您可以通过处理下拉单击事件来实现这一点。 例如，这将在单击下拉列表时设置第一个项目的内容：

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

$（“.下拉菜单a”）。单击（函数（）{
$（“.btn:first child”）.html（$（this.text（）+”）；
});

下面是一个演示：