Javascript中的下拉菜單

-6

我剛剛使用Javascript，我跌倒了。做了一個HTMl/CSS但沒有JS。有人可以告訴我需要在JS中做什麼來使我的代碼工作？ :)Javascript中的下拉菜單

<html> 
<head> 
<meta charset="utf-8"> 
<title>Uppgift 2</title> 
<script type="text/javascript" src="menu.js"></script> 
<link rel="stylesheet" type="text/css" href="menu.css"> 
</head> 

<body> 
<ul class="nav"> 
    <li class="button-dropdown"> 
     <a href="javascript:void(0)" class="dropdown-toggle"> 
      Mandagens Lunch <span>#</span> 
     </a> 
     <ul class="dropdown-menu"> 
      <li> 
       <a href="#"> 
        Carbonara 
       </a> 
      </li> 
      <li> 
       <a href="#"> 
        Pizza 
       </a> 
      </li> 
      <li> 
       <a href="#"> 
        Köttbullar Med Mos 
       </a> 
      </li> 
     </ul> 
    </li> 
</ul> 
</body> 
</html>

來源

2017-01-30 Hippimaster

出於某種原因s，我們無法調試圖像... –

請提供您的代碼作爲代碼...如果您不能在這裏做「某些原因」，請在這裏執行：http://codepen.io/ –

什麼是實際你試圖達到的結果？點擊切換下拉菜單？你願意使用jQuery嗎？搜索谷歌有多困難：如何在js中製作下拉菜單？ – kiwi1342

在這裏，我從頭開始建立一些東西..不美觀，但它的工作原理。

JS：

var dropdownHidden = true; 
function toggleDropdown(){ 
    if(dropdownHidden){ 
    document.getElementById('dropdown-menu').style.display = ''; 
    dropdownHidden = false; 
    } else { 
    document.getElementById('dropdown-menu').style.display = 'none'; 
    dropdownHidden = true; 
    } 
}

HTML：

<body> 
<ul class="nav"> 
    <li class="button-dropdown"> 
     <a href="#" class="dropdown-toggle" onClick="toggleDropdown()"> 
      Mandagens Lunch <span>#</span> 
     </a> 
     <ul id="dropdown-menu" class="dropdown-menu" style="display: none"> 
      <li> 
       <a href="#"> 
        Carbonara 
       </a> 
      </li> 
      <li> 
       <a href="#"> 
        Pizza 
       </a> 
      </li> 
      <li> 
       <a href="#"> 
        Köttbullar Med Mos 
       </a> 
      </li> 
     </ul> 
    </li> 
</ul> 
</body>

Codepen：http://codepen.io/anon/pen/xgpdYO

注：這是一個「你沒有帶提供的任何代碼解決方案」

來源

2017-01-30 11:01:44

Javascript中的下拉菜單

回答

相關問題