javascript - Bootstrap Dropdown 选择正在*所有* 下拉菜单上设置选择

Question

SO 有很多问题询问如何设置选定下拉列表的值，例如 How to Display Selected Item in Bootstrap Button Dropdown Title 。这非常有效，直到您向页面添加第二个(或第三个...)下拉列表。然后发生的事情是，在下拉列表 A 上选择一个值也会在下拉列表 B 和 C 上设置该值...

这是我的 fiddle

$(".dropdown-menu li a").click(function () {
    var item = $(this).text();        
    $(".btn:first-child").text(item);
    $(".btn:first-child").val(item);    
});

当前选择器正在选择所有下拉菜单。而需要的是选择所选下拉菜单按钮组中的按钮，或者通过父级进行遍历，这两个问题我都未能解决。

感谢任何帮助。

Answer 1

当您有 $(".btn:first-child") 时，您正在搜索所有按钮

您需要相对于当前元素:

 $(".dropdown-menu li a").click(function () {
    var item = $(this).text();        
    $(this).closest(".btn-group").find(".btn:first-child").text(item);
    $(this).closest(".btn-group").find(".btn:first-child").val(item);
});