2014-10-30 231 views
1

我想從我的頁面中刪除一個div,一旦收到XMPHttpRequest響應。我也嘗試將div的顯示設置爲none:document.getElementById('password')。style.display ='none';但那也沒用。使用JavaScript從頁面中刪除div

HTML:

<div class="login-container"> 
     <div class="title">Login Form</div> 
     <div class="form-fields" id="form-fields"> 
      <form name="login_form" method="post" id="login-form" onsubmit="return submitForm()"> 
       <input type="text" name="username" id="username" placeholder="Username" required></input> 
       <input type="password" name="password" id="password" placeholder="Password" required></input> 
       <input type="submit" value="Log in" id="submit-button"></input> 
       <input id="sessionID" class="hidden"></input> 
      </form> 
     </div> 
     <div id="success-message" class="hidden">Congratulations! You have been logged in.</div> 
     <button id="logout" class="hidden"></button> 
</div> 

JavaScript函數:

function sendLoginInfo() { 
     var loginRequest = new XMLHttpRequest(); 
     loginRequest.open("POST", "server/login.php", false); 
     loginRequest.setRequestHeader('Content-type', "application/json"); 
     loginRequest.onreadystatechange = function() { 
      if(loginRequest.readyState == 4 && loginRequest.status == 200) { 
       sessionID = keyRequest.responseText; 
       var el = document.getElementById('password'); 
       el.parentNode.removeChild(el); 

      } 
     } 
     loginRequest.send(JSON.stringify(JSONFormData)); 
} 

更新

這個問題已經解決了改變:

<form name="login_form" method="post" id="login-form" onsubmit="return submitForm()"> 

收件人:

<form name="login_form" method="post" id="login-form" onsubmit="submitForm(); return false;"> 
+0

也看到這個:http://stackoverflow.com/questions/3387427/javascript-remove-element-by-id – 2014-10-30 22:35:06

+2

你的'if'實際上是否進入? – 2014-10-30 22:44:13

+0

編寫的代碼應該可以工作,如果執行**'var el = document.getElementById('password')'並返回一個元素。 – RobG 2014-10-30 22:46:20

回答

-1

代替

document.getElementById('password').style.display = 0; 

嘗試

document.getElementById('password').style.display = 'none'; 
+0

對不起,這是一個錯字,那是我試過的 – Micah 2014-10-30 22:36:58

-1

你真的無法刪除的div據我知道,但你可以設置一個div的可見性「沒有「(不是你試過的」0「)。

style="display:none" 

這使得div無形並且不會有任何空白。

+0

對不起是一個錯字,這就是我試過 – Micah 2014-10-30 22:37:33

+0

的CSS規則都設置在不同的文件。由於某種原因,當我嘗試設置它不在元素上設置的樣式時 – Micah 2014-10-30 22:38:11