顯示並隱藏父母onclick事件隱藏的div

我想創建一個通訊縮略圖列表，它將顯示並隱藏它的父標題的onclick事件。該函數被正確調用以顯示列表，但不會在第二次點擊時再次隱藏。我確信這是一件簡單的事情，但我不知所措。顯示並隱藏父母onclick事件隱藏的div

function showBabList() { 
 
    if (document.getElementById('bablist').style.display = "none") { 
 
    document.getElementById('bablist').style.display = "block"; 
 
    } else { 
 
    document.getElementById('bablist').style.display = "none"; 
 
    } 
 
}

<h2 onclick="showBabList()">BITSandBYTES Newsletters</h2> 
 
<div id="bablist" style="display: none;"> 
 
    <ul> 
 
    <a href="newsletter/BITSandBYTES2017-07.pdf" target="bab"><img src="images/thumbs/BITSandBYTES2017-07_thumb.png" class="babthumb" height="100px" width="75px"></a> 
 
    <a href="newsletter/BITSandBYTES2017-08.pdf" target="bab"><img src="images/thumbs/BITSandBYTES2017-08_thumb.png" class="babthumb" height="100px" width="75px"></a> 
 
    </ul> 
 
</div>

來源

2017-09-13 RevFonzAyy

我認爲你需要使用==而不是=的document.getElementById（ 'bablist'）。的style.display == 「無」 –

function showBabList() { 
 
    if (document.getElementById('bablist').style.display == "none") { 
 
    document.getElementById('bablist').style.display = "block"; 
 
    } else { 
 
    document.getElementById('bablist').style.display = "none"; 
 
    } 
 
}

<h2 onclick="showBabList()">BITSandBYTES Newsletters</h2> 
 
<div id="bablist" style="display: none;"> 
 
    <ul> 
 
    <a href="newsletter/BITSandBYTES2017-07.pdf" target="bab"><img src="images/thumbs/BITSandBYTES2017-07_thumb.png" class="babthumb" height="100px" width="75px"></a> 
 
    <a href="newsletter/BITSandBYTES2017-08.pdf" target="bab"><img src="images/thumbs/BITSandBYTES2017-08_thumb.png" class="babthumb" height="100px" width="75px"></a> 
 
    </ul> 
 
</div>

WRONG
if (document.getElementById('bablist').style.display = "none")

CORRECT
if (document.getElementById('bablist').style.display == "none")

來源

2017-09-13 17:44:01 zynkn

喬治，你是正確的。我認爲，既然這個函數是從頭開始的，它不需要進一步解決這個問題。 – RevFonzAyy

顯示並隱藏父母onclick事件隱藏的div

回答

相關問題