1. <form>으로 <input>을 감싸야 하는 이유: 유효성 검사를 하기 위해서
▷ 유효성(validation) 검사란? 입력한 데이터 값을 서버에 전송하기 전에 특정 규칙에 맞게 입력되었는지 확인하는 것.
필수요소를 빼먹거나, 비밀번호 등의 정보를 잘못 입력할 경우 사용자에게 오류가 있음을 알려준다.
<form>으로 감싸지 않을 경우, Enter키를 눌러도 submit이 되지 않을 수 있다. 그 이유는 <button>을 <input>과 연관시키지 못하고 별도의 독립적인 요소로 보기 때문.
2. submit 이벤트
Note that the submit event fires on the <form> element itself, and not on any <button> or <input type="submit"> inside it. <출처: MDN>
// HTML
<body>
<form id="registerForm">
<label for="username"> username </label>
<input type="password" name="password" id="username">
</form>
</body>// Javscript
registerForm.addEventListener("submit", (event) => {
event.preventDefalut();
alert("great!")
});
'Development > TIL' 카테고리의 다른 글
| [TIL] 2021-09-10 (0) | 2021.09.14 |
|---|---|
| [TIL] 2021-08-24 (0) | 2021.08.26 |
| [TIL] 2021-08-04 (0) | 2021.08.05 |
| [TIL] 2021-07-31 (0) | 2021.08.01 |
| [TIL] 2021-07-30 (0) | 2021.07.30 |
댓글