Bootstrap：如何在模式窗口关闭时更改菜单项颜色答案

【问题标题】：Bootstrap: How to change menu item color due modal window closingBootstrap：如何在模式窗口关闭时更改菜单项颜色
【发布时间】：2013-07-04 13:20:18
【问题描述】：

我正在使用 twitter 引导程序并尝试通过单击菜单项来打开模式弹出窗口。这是我的代码：

<div class="navbar navbar-fixed-bottom">
    <div class="navbar-inner">
        <ul class="nav pull-right">
            <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Menu</a>
                <ul class="dropdown-menu">
                    <li class="active"><a href="">Some item 1</a></li>
                    <li class=""><a href="">Some item 2</a></li>
                </ul>
            </li>
            <li class="dropdown"><a href="#myModal" class="dropdown-toggle" data-toggle="modal">
                Contacts</a></li>
        </ul>
    </div>
    <!-- /.navbar-inner -->
</div>

还有我的模态窗口：

<div class="modal hide" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
    aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
            ×</button>
        <h3 id="myModalLabel">
            Modal header</h3>
    </div>
    <div class="modal-body">
        <p>
            One fine body…</p>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">
            Close</button>
        <button class="btn btn-primary">
            Save changes</button>
    </div>
</div>

第一个菜单项具有下拉数据切换。第二个菜单项具有模式数据切换。当我点击第一个项目时，它看起来就像点击并改变了自己的颜色。当我单击他的第二个（联系人）菜单项时，项目颜色保持不变。我为“联系人”li 元素添加了 onclick 事件：

onclick="$(this).addClass('modal-open-li');"

我正在编写自己的modal-open-li 类以使该元素被点击。但是，当我关闭模态弹出窗口时，如何返回 li 元素的颜色？另外，我可以为同一个li 元素（如data-toggle="modal dropdown"）添加多个数据切换吗？

【问题讨论】：

请注意标签bootstrap 和twitter-bootstrap 的含义不同。不要将bootstrap 用于 Twitter 引导问题。另外，这与css3无关。请不要用不适用的标签标记问题。
知道了！感谢您指出错误。

标签： javascript css twitter-bootstrap

【解决方案1】：

如果我理解正确，您想在模式关闭时将类删除到您的链接中，因为您可以绑定到模型的“隐藏”事件，请尝试添加以下 JavaScript 代码：

$('#myModal').on('hide',function(){
    $('.nav > li > a.modal-open-li').removeClass('modal-open-li');
});

关于为一个元素添加多个数据切换，我不知道这是否可能，但我建议不要这样做，因为您真的需要同时切换下拉菜单和打开模式吗？我认为会有更好的方法来改善用户体验

【讨论】：

这就是我需要的。谢谢！