使用 JavaScript 創建注冊頁面時遇到問題

Question

現在我正在嘗試為我的網站創建一個注冊頁面目前我有一個注冊按鈕和一些 javascript 應該連接到它，所以注冊頁面本身就會出現

html：

 <button class="Sign-Up-Button" id="Sign-Up-Button" onclick="revealSignup"></button>

   <div class="Signing-up" id="Sign-Up">
    <form action="results.html" method="GET">
        <div>
        <label>Name</label>
            <input>
            </div>
        <div>
        <label>Password</label>
             <input>
      </div>
      </form>
      <button id="Sumbit-End">Sumbit</button>
      </div>
      

css：

 .Sign-Up-Button{
   background-color: #0099ff;
   position: absolute;
   text-align: center;
   font-family: monospace;
   font-size: 25px;
   border-radius: 15px;
   color: white;
   height: 50px;
   width: 105px;
 }
    
    
    .Signing-up {
    position: absolute;
    top: 370px;
    left: 850px;
        background-color: white;
        z-index: 1; 
        display: none;
    }

Java 腳本：

function revealSignup(){
    document.getElementById("Sign-Up-Group").style.display = 'block';
}
   
 
  

Answer 1

首先，在 Javascript 中，您需要定位 #Sign-Up 而不是 #Sign-Up-Group，因為它在您的 HTML 中不存在。 其次，在 HTML 中，單擊時調用 function 時需要打開括號

HTML 更改：

<button class="Sign-Up-Button" id="Sign-Up-Button" onclick="revealSignup()"></button>

Javascript 更改：

document.getElementById("Sign-Up").style.display = 'block';