button 활성화

woong3e·2023년 5월 12일
0

html

<div class="container">
      <h1 class="logoText">westagram</h1>
      <div class="login">
        <input
          id="loginIdInput"
          type="text"
          placeholder="전화번호,사용자 이름 또는 이메일"
        />
        <input id="loginPwInput" type="password" placeholder="비밀번호" />
        <button id="loginBtn">로그인</button>
      </div>
      <div><a href="">비밀번호를 잊으셨나요?</a></div>
    </div>

javascript

loginBtn.disabled = true;
function btnActive() {
  const loginId = loginIdInput.value;
  const loginPw = loginPwInput.value;
  const isValid = loginId.length > 0 && loginPw.length > 0;
  isValid ? (loginBtn.disabled = false) : (loginBtn.disabled = true);
}
loginIdInput.addEventListener("input", btnActive);
loginPwInput.addEventListener("input", btnActive);

삼항연산자 쓸 때

isValid = true ?(loginBtn.disabled = false) : (loginBtn.disabled = true);
}

조건식 = true로 둬서 코드가 실행이 안되는 오류가 있었다.

condition ? exprIfTrue : exprIfFalse

0개의 댓글