Bootstrap：如何更改菜單項顏色由於模式窗口關閉

我使用twitter引導並試圖通過單擊菜單項打開模式彈出窗口。這裏是我的代碼：Bootstrap：如何更改菜單項顏色由於模式窗口關閉

<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>

第一個菜單項具有下拉數據切換。第二個菜單項具有模態數據切換。當我點擊第一個項目時，它看起來像點擊並改變自己的顏色。當我點擊第二個（聯繫人）菜單項時，項目顏色保持不變。我添加onclick事件的「聯繫人」 li元素：

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

在那裏我寫我自己modal-open-li類，使這個點擊的元素。但是當我關閉模態彈出窗口時，如何返回li元素的顏色？另外，我可以添加多個數據切換爲相同的li元素，如data-toggle="modal dropdown"？

來源

2013-07-06 mbigun

請注意標籤[tag：bootstrap]和[tag：twitter-bootstrap]意味着不同的東西。請勿將[tag：bootstrap]用於Twitter引導問題。此外，這與css3無關。請不要使用不適用的標籤標記問題。 –

Got it！感謝您指出錯誤。 – mbigun

如果我理解正確的話，你希望在模式關閉時刪除類到你的鏈接，對於可以綁定到模型中「隱藏」的事件，嘗試添加這段JavaScript代碼：

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

而且關於爲一個元素添加多個數據切換，我不知道是否有可能，但我會建議不要這樣做，因爲您是否真的需要切換下拉菜單並同時打開模式？我認爲會有更好的方法來改進UX

來源

2013-07-06 19:46:15

這就是我需要的。謝謝！ – mbigun

Bootstrap：如何更改菜單項顏色由於模式窗口關閉

回答

相關問題