JavaScript錯誤與菜單欄

Question

嗨我寫了我的菜單欄代碼如下所示。只有當鼠標位於菜單上時，菜單欄纔會展開。但它默認情況下正在擴展。

<dt onmouseover="javascript:montre('smenu1');"> 

    <a href="#">&#9679; About Us</a></dt> 
    <dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre();"> 
     <ul> 
      <li><a href="../php_sql_scripts/index.php">&ordm; What is microEP?</a></li> 
     </ul> 
    </dd> 

<dt onmouseover="javascript:montre('smenu12');"> 

    <a href="#">&#9679; News</a></dt> 
    <dd id="smenu12" onmouseover="javascript:montre('smenu12');" onmouseout="javascript:montre();"> 
     <ul> 
      <li><a href="../php_sql_scripts/news.php">&ordm; Department News</a></li> 
     </ul> 
    </dd> 

<dt onmouseover="javascript:montre('smenu13');"> 

    <a href="#">&#9679; Calendar</a></dt> 
    <dd id="smenu13" onmouseover="javascript:montre('smenu13');" onmouseout="javascript:montre();"> 
     <ul> 
      <li><a href="../php_sql_scripts/calendar.php">&ordm; Calendar of events</a></li> 
     </ul> 
    </dd> 


<script type="text/javascript"> 
window.onload=montre; 
function montre(id) { 
var d = document.getElementById(id); 
    for (var i = 1; i<=14; i++) 
    { 
     if (document.getElementById('smenu'+i)) 
     { 
      document.getElementById('smenu'+i).style.display='none'; 
     } 
    } 
if (d) 
    { 
    d.style.display='block'; 
    d.style.zIndex = 12; 
    } 
} 
</script> 

Answer 1

當頁面加載時，您必須隱藏元素。有不同的方式做到這一點：

1. 樣式添加到每個元素與display: none
2. 通過CSS文件
3. 呼叫montre()在不同負載情況下的一個這樣做，對於爲例window.onload

另一個話題，就像在其中一個評論中說的那樣，你應該使用一個庫來做到這一點，例如jQuery。