Html引導下拉不起作用

這是一家餐廳的演示網站。在菜單中我想添加一個下拉菜單，但它不起作用。沒有任何反應，我懸停或點擊菜單。下面是代碼：Html引導下拉不起作用

<body> 
    <nav class="navbar navbar-inverse navbar-static-top" role="navigation"> 
    <div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
     <span class="sr-only">Toggle Navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#">Ristorante Con Fusion</a> 
    </div> 

    <div id="navbar" class="navbar-collapse collapse"> 
     <ul class="nav navbar-nav"> 
     <li class="active"><a href="#">Home</a></li> 
     <li><a href="#">About</a></li> 
     <li class="dropdown"> 
      <a href="#" class="dropdown-toggle" data-toogle="dropdown" role="button" > 
      Menu<span class="caret"></span></a> 
      <ul class="dropdown-menu"> 
      <li><a href="#">Appetizers</a></li> 
      <li><a href="#">Main Courses</a></li> 
      <li><a href="#">Desserts</a></li> 
      <li><a href="#">Drinks</a></li> 
      <li role="separator" class="divider"></li> 
      <li class="dropdown-header">Specials</li> 
      <li><a href="#">Lunch Buffet</a></li> 
      <li><a href="#">Weekend Brunch</a></li> 
      </ul> 
     </li> 
     <li><a href="#">Contact</a></li> 
     </ul> 
    </div> 
    </nav>

和源代碼：

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<!-- Include all compiled plugins (below), or include individual files as needed --> 
    <script src="js/bootstrap.min.js"></script>

請幫助我。 它顯示插入符號的跡象，但點擊它

來源

2016-05-30 Utpal Kant

望着引導文檔後沒有任何反應，它看起來像你需要一個ID添加到激活下拉列表，然後添加aria-labelledby="dropdownMenu1"到菜單部分的按鈕。

下面是來自文檔的示例

<div class="dropdown"> 
    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
    Dropdown 
    <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> 
    <li><a href="#">Action</a></li> 
    <li><a href="#">Another action</a></li> 
    <li><a href="#">Something else here</a></li> 
    <li role="separator" class="divider"></li> 
    <li><a href="#">Separated link</a></li> 
    </ul> 
</div>

來源

2016-05-30 19:10:50

呀...... 什麼用詠歎調 - 擴大和詠歎調 - haspopup？ –

語法錯誤與連桿的行：

不是數據的toogle =「下拉菜單」，但數據肘節=「下拉菜單」

來源

2016-05-30 19:12:54

是的，謝謝...我很困惑。我沒有注意到這一點。 –

你有一個錯字在這一行

變化：

<a href="#" class="dropdown-toggle" **data-toogle**="dropdown" role="button">Menu<span class="caret">

要這樣：

爲

<a href="#" class="dropdown-toggle" **data-toggle**="dropdown" role="button">Menu<span class="caret">

來源

2016-05-30 19:13:25

是的...我知道了....非常感謝.. –

工作我

<div class="btn-group first_button"> 
    <button type="button" class="btn btn-default">**</button> 
    <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
     <span class="caret"></span> 
     <span class="sr-only">Toggle Dropdown</span> 
    </button> 
    <ul class="dropdown-menu"> 
     <li>**</li> 
     <li role="separator" class="divider"></li> 
     <li>**</li> 
    </ul> 
    </div>

來源

2016-05-30 19:51:35

無論是詠歎調 - 擴展應該是真的還是假的？ –

如果可摺疊元素默認關閉，則其值應爲aria-expanded =「false」。如果您已使用in類將默認元素設置爲默認打開，請在控件上設置aria-expanded =「true」 –

Html引導下拉不起作用

回答

相關問題