2014-10-30 2 views
1

XMPHttpRequest 응답을 받으면 내 페이지에서 div를 제거하려고합니다. 나는 또한 div를 none으로 설정하려고 시도했다. document.getElementById ('password'). style.display = 'none'; 그러나 그 didnt 일.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> 

자바 스크립트 기능 :이 문제는 변화에 의해 해결되었다

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 –

+2

실제로 'if'가 입력 되었습니까? –

+0

작성된 코드는 ** ** var el = document.getElementById ('password')'가 실행되고 요소를 반환하는 경우 작동해야합니다. – RobG

답변

-1

대신

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

의 내가 아는 한 당신은 정말 멀리 된 div를 제거 할 수 없습니다

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

미안하지만 오타가되었습니다. 그게 제가 시도한 것입니다. – Micah

-1

을 시도하지만 당신은 사업부의 가시성을 "설정할 수 있습니다 없음 "(시도한대로"0 "이 아님).

style="display:none" 

이렇게하면 div가 보이지 않으며 공백이 없습니다.

+0

미안합니다. 오타가 있었는데, 내가 시도한 것입니다. – Micah

+0

CSS 규칙은 모두 다른 파일에 설정되어 있습니다. 스타일을 설정하려고 할 때 어떤 이유로 요소에 설정되지 않습니다. – Micah