簡體   English   中英

使用JS if語句通過按鈕更改div類(我在做什么錯)?

[英]Using JS if statement to change div class with button (what am I doing wrong)?

 function navtoggle(elementRef) { if (document.getElementById('nav').className = 'closed') { document.getElementById('nav').className = 'open' } else if (document.getElementById('nav').className = 'open') { document.getElementById('nav').className = 'closed' }; } 
 .closed { display: none; } .open { display: block; } #navget { width: 100px; height: 100px; box-shadow: 0px 0px 15px black; } 
 <html> <head> <link rel="stylesheet" type="text/css" href="style.css"> <title>HTML Library</title> </head> <body> <div id="nav" class="closed"> <ul> <li><a href="index.html"><h1>HOME</h1></a> </li> </ul> </div> <button onclick="JavaScript: navtoggle(this);" id="navget">NAV</button> </body> </html> 

這是HTML:

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="style.css">
        <title>HTML Library</title>
    </head>
    <body>
        <div id="nav" class="closed">
            <ul>
                <li><a href="index.html"><h1>HOME</h1></a></li>
            </ul>
        </div>
 <button onclick="JavaScript: navtoggle(this);" id="navget">NAV</button>
    </body>
</html>

JS:

function navtoggle(elementRef){
if (document.getElementById('nav').className = 'closed') 
    {document.getElementById('nav').className = 'open'}

else if (document.getElementById('nav').className = 'open')
    {document.getElementById('nav').className = 'closed'};

}

和CSS:

.closed {
    display: none;
}

.open {
    display: block;
}

#navget {
    width: 100px; height: 100px;
}

我知道只使用復選框會更容易,而且我確實知道該怎么做。 但是,我希望它只是一個按鈕,這樣我才能使其看起來更好。 我對JS很陌生,所以請不要對這個愚蠢的問題太苛刻。 謝謝。

在條件語句中,您使用“ =”而不是“ ==“

 if (document.getElementById('nav').className == 'closed') {
    document.getElementById('nav').className = 'open'
  } else if (document.getElementById('nav').className == 'open') {
    document.getElementById('nav').className = 'closed'

您的sintax有幾個問題,我在這里為您提供了一個小工具因此您可以看到所有詳細信息,但基本上是:

function navtoggle(elementRef){
  if (document.getElementById('nav').className === 'closed')  {
    document.getElementById('nav').className = 'open'
  }
  else if (document.getElementById('nav').className === 'open'){
    document.getElementById('nav').className = 'closed'
  } //You was using semicolon here and that wasn't parsing well
}

我不知道是否也想在標題中添加腳本,但請告訴我它是否有效

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM