Form 태그 활용

form 태그의 기본 기능은 Submit 이 달려있고 action으로 설정한 곳으로 이동시키는 기능이 있다.

아이디 로그인 시스템

아이디 로그인을 위해선 정규식을 알아야 하고 기본 사용법은 하위항목 참조

window.addEventListener('submit', function(event) {
            event.preventDefault();
            let regId = /^(?=.*[\W_])(?=(?:\D*\d){2})[a-zA-Z\d\W_]{8,15}$/;
            if(!regId.test(elInput[0].value)) {
                alert("틀려")
                elInput[0].focus();
                return;
            }

기본규칙은 submit 이벤트 감지로 function 실행해주면 된다. if 부정문 사용하여 틀린값으로만 값이 나오게 설정한다. focus 명령어는 해당 사항에 빨간 줄을 그이게 한다, 고로 틀린 부분에 빨간줄이 그이게 된다. return? 여부는 확인 바람

이후 아래구문을 통해 form을 submit 시키고 넘어가면 된다.

member.submit();

동의 체크박스 기능

article.addEventListener("click", function(event) {
    if(event.target.id == "checkAll") {
        check1.checked = event.target.checked;
        check2.checked = event.target.checked;
    }

    if(check1.checked && check2.checked) {
        checkAll.checked = true;
    } else {
        checkAll.checked = false;
    };
})

위 기능대로 각각 check1, check2 checkAll 이란 아이디의 input checkbox 들이 존재하고 각각 checked 상태 활용하여 작동함 모두동의 버튼과 아래 두 check 항목 체크시 checkAll 같이 체크되는 사항 확인할 것 checked = boolean 값 도출