使用javascript隐藏div，直到按下按钮

目标：当按下ADD按钮时，div“addStudentClub”可见，但在按下按钮之前不应可见

当前，无论是否按下按钮，div中的窗体都会显示

这是我目前拥有的php代码。我使用了一个指向外部javascript文件的链接，该文件的内容低于php文件。我不知道是否有任何javascript相关的项目是正确的-这是我第一次使用它，所以我为任何明显的愚蠢错误道歉

//Add students to club
echo "<script type=\"text/javascript\" src=\"javascript.js\"></script>";
echo "<div class='addButton'>";    
echo "<form method='POST' action='clubInfo.php?clubid=$ClubID&user=$user'>";
echo "<input type='submit' name='submit'  value='ADD' onclick='Javascript: showaddStudentClub();'>";
echo "</form>";
if (isset($_POST['submit']))   {
     echo "Add New  Student to: " . $nameofclub . "<br>";
     echo "Please enter the following details: " . "<br>";
}
echo "</div>";

//to be hidden until button has been pressed
echo "<div id='addStudentClub' style='display: hidden'>";
... (I have removed all the php because it's very long)
echo <<<_END
    <form method='post' action='clubInfo.php?clubid=$ClubID'>$error
    <span class='fieldname'>addfname</span><input type='text'
    maxlength='30' name='addfname' value='$addfname'>
    <span class='fieldname'>addlname</span><input type='text'
    maxlength='50' name='addlname' value='$addlname'>  
    <span class='fieldname'>addyear</span><input type='integer'
    maxlength='30' name='addyear' value='$addyear'>   
_END;
     echo "<span class='fieldname'>&nbsp;</span>";
     echo "<input type='submit' value='SAVE'>";
     echo "</form>"; 
 echo "</div>";

---

我提前感谢您的评论：）

正确的CSS样式是

display:none

：

echo "<div id='addStudentClub' style='display: none'>";

echo”“；
正确的CSS样式是
显示：无
：

echo "<div id='addStudentClub' style='display: none'>";

echo”“；
您可以使用javascript或CSS来完成

Javascript:

   document.addEventListener("DOMContentLoaded", function(e) { 
       document.getElementById('addStudentClub').style.display = 'none';
    });

CSS:

你可以用javascript或者CSS来实现

Javascript:

   document.addEventListener("DOMContentLoaded", function(e) { 
       document.getElementById('addStudentClub').style.display = 'none';
    });

CSS:

我认为当你按下相关按钮时，应该可以显示你想要的部件

我认为当您按下相关按钮时，应该可以显示您想要的部件。
我认为使用jQuery会更容易。你试过了吗？可能是这样的：（谷歌：
jqueryshow-hide-div
）哇。有很多回声。。听说过heredocs吗？我很感谢你的评论，但是有人告诉我必须使用JavaScripts，我认为使用jQuery会更容易。你试过了吗？可能是这样的：（谷歌：
jqueryshow-hide-div
）哇。有很多回声。。听说过heredocs吗？我很感激你的评论，但有人告诉我必须使用JavaScripthNakYou！当按下按钮时，我如何让它显示出来？你的JavaScript应该可以做到这一点。谢谢！当按下按钮时，我如何让它显示出来？你的JavaScript应该可以做到这一点。
var theButton = document.getElementById("#IdOfTheButton");
theButton.addEventListener("click",function(){
document.getElementById('addStudentClub').style.display = 'block';
})