loginDiv
디스플레이가 표시되지 않지만 전혀 작동하지 않는 경우 로그인을 위해 일부 input
필드를 재설정하려고합니다.JavaScript 재설정 조건이있는 입력
원하는 결과 : loginDiv
표시가없는 한 로그인 버튼을 클릭하면 두 입력 필드가 재설정됩니다. 사용자 이름과 암호가 확인 된 후
// LOGIN
const logDiv = document.getElementById('loginDiv');
const wrong = document.getElementById('wrong');
const user = document.getElementById('user');
const pass = document.getElementById('pass');
const log = document.getElementById('logBtn');
log.addEventListener('click',() => {
if (user.value == 'f' && pass.value == 'f') {
logDiv.style.display = 'none';
wrong.style.display = 'none';
} else {
wrong.style.display = 'block';
}
});
// LOGOUT
const logout = document.getElementById('logout');
logout.addEventListener('click',() => {
if (logDiv.style.display == 'none') {
logDiv.style.display = 'block';
}
});
function resetForm() {
if (logDiv.style.display == 'none') {
user.reset();
pass.reset();
}
}
<div id="loginDiv">
<input id="user" type="text" placeholder="username"></input>
<input id="pass" type="password" placeholder="password"></input>
<button id="logBtn" onclick="resetForm()">login</button>
</div>
<div id="wrong" style="display: none;">
<p id="wrongText">incorrect login info.</p>
</div>
<div id="logoutDiv">
<button id="logout" type="button">logout</button>
</div>
'디스플레이 : 실제로 none' ** 제거 ** 자바 스크립트가 더 이상이 없다는 의미 DOM에서 요소, 에 액세스하십시오. 귀하의 필드가 제거하려고하는 DIV 안에 있다고 생각하면 달성하려는 것은 불가능합니다. 도움이된다면'visibility : hidden'을 사용하여 원하는 결과를 얻을 수 있습니다. –
@ObsidianAge 틀렸어. 'display : none'을 설정해도 DOM에서 그것을 제거하지 못하면 단순히 CSS의 display 속성을 none으로 설정합니다. –