자바스크립트로 유효성 검사하기
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script>
function myFocus() {
let pwd = document.getElementById("pwd");
console.log(pwd.value);
if (pwd.value == "") {
alert("password 는 필수 항목입니다");
pwd.focus();
} else {
document.getElementById("copy").value = pwd.value;
pwd.value = "";
}
}
const pwdChk = () => {
let pwd = document.getElementById("pwd");
let pwdC = document.getElementById("pwdCheck");
if (pwd.value !== pwdC.value) {
alert("비밀번호가 일치하지 않습니다.");
pwd.value = "";
pwdC.value = "";
pwd.focus();
}
};
</script>
</head>
<body>
<!-- <form action="ex30.html" method="get">
<input type="text" id="txt" required /><br />
<input type="text" id="pwd" /><br />
<input type="text" id="copy" /><br />
<input type="submit" value="클릭" onclick="myFocus()" /><br />
</form> -->
<input type="text" id="txt" placeholder="id" /><br />
<input type="password" id="pwd" placeholder="pwd" /><br />
<input
type="text"
id="pwdCheck"
placeholder="pwdCheck"
onchange="pwdChk()"
/><br />
<input type="text" id="copy" placeholder="copy" /><br />
<input type="button" value="클릭" onclick="myFocus()" /><br />
</body>
</html>
728x90
'FE > JavaScript' 카테고리의 다른 글
| [JavaScript] button 태그와 submit 태그의 차이 (0) | 2024.03.27 |
|---|---|
| [JavaScript] confirm, open (0) | 2024.03.27 |
| [JavaScript] js 파일로 자바스크립트 코드 관리 (0) | 2024.03.27 |
| [JavaScript] setTimeout, setInterval, 자식요소 (추가, 삭제) (0) | 2024.03.26 |
| [JavaScript] 배열 (0) | 2024.03.26 |