更改兄弟姐妹li背景颜色为bootstrap 3下拉菜单

Question

HTML

<div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
        <li>
            <a href="#about">User01</a>
        </li>
        <li>
            <a href="#contact">Profile</a>
        </li>
        <li class="dropdown">
            <a class="dropdown-toggle" href="#" data-toggle="dropdown">
             Dropdown
            <b class="caret"></b>
            </a>
                <ul class="dropdown-menu">
                    <li>
                        <a href="#">User Control01</a>
                    </li>
                    <li>
                        <a href="#">User Control02</a>
                    </li>
                    <li>
                        <a href="#">User Control03</a>
                    </li>
                </ul>
         </li>
         <li>
             <a href="#contact">Link</a>
         </li>
     </ul>
</div>

点击下拉列表链接更改 User01 和个人资料 li背景颜色我想这样;

点击下拉链接;

如何使用bootstrap 3下拉菜单执行此操作？

Answer 1

您可以为之前的兄弟姐妹切换bootstraps .active类：

$(".dropdown").click(function(){
    $this).prevAll().toggleClass("active");
});

示例：http://jsfiddle.net/52VtD/362/