JS顯示/隱藏div的來源，沒有按預期工作

Question

我寫的顯示/隱藏divs的sorce。

如果當你嘗試顯示新的div時，顯示一些div，它會隱藏他。

這裏是我建：http://talkbox.co.il/text.htm

，如果你會嘗試它，你會看到，如果你試圖表現出「選項」和「notific」（反之亦然）的一些次後，其沒有工作以及。你需要點擊2次才能工作。

爲什麼它不起作用？

我想也許它是因爲更新this.isMenuOptionsOpen = false; this.isMenuNotificOpen = false;。我怎樣才能解決這個問題？

---

這是完整的源代碼：

<script> 
    this.isMenuOptionsOpen = false; 
    this.isMenuNotificOpen = false; 
    function menuOptions() { 
     if (this.isMenuOptionsOpen == false) { 
      document.getElementById('menuOptions').style.display = 'block'; 
      this.isMenuOptionsOpen = true; 
      document.getElementById('menuNotific').style.display = 'none'; // close another menu if open 
     } 
     else { 
      document.getElementById('menuOptions').style.display = 'none'; 
      this.isMenuOptionsOpen = false; 
     } 
    } 
    function menuNotific() { 
     if (this.isMenuNotificOpen == false) { 
      document.getElementById('menuNotific').style.display = 'block'; 
      this.isMenuNotificOpen = true; 
      document.getElementById('menuOptions').style.display = 'none'; // close another menu if open 
     } 
     else { 
      document.getElementById('menuNotific').style.display = 'none'; 
      this.isMenuNotificOpen = false; 
     } 
    } 
</script> 


<!-- buttons to show/hode the divs--> 
<a href="javascript: menuOptions();"> options </a><br> 
<a href="javascript: menuNotific();"> notific </a> 
<!-- end buttons to show/hode the divs --> 


<!-- divs to show/hide --> 
<div id='menuOptions' style='width:100px; height:100px; background-color:green; display:none; position:relative; color:black;'>menu options</div> 
<div id='menuNotific' style='width:100px; height:100px; background-color:yellow; display:none; position:relative; color:black;'>menu notific</div> 
<!-- end divs to show/hide --> 

Answer 1

當你打開選項，然後Notific，isMenuOptionsOpen仍設置爲TRUE，所以當你問到打開它，你的函數嘗試關閉它並將isMenuOptionsOpen設置爲FALSE，最後再點擊一次即可打開它。

當您打開Notific時，您需要將isMenuOptionsOpen設置爲FALSE。