[얼렁뚱땅] 간단한 모달 창 만들기 (4) - 조건문 써서 조건에 안 맞으면 폼 전송 막기

전 포스트에서 이어가서...

아이디와 비밀번호 값 공백검사와
비밀번호 입력값이 6자 미만일 경우 alert 창을 띄웠다.

(아이디값 공백검사)

(비밀번호값 공백검사)

(비밀번호 6자 이상 조건 검사)

코드

<script>
        $('form').on('submit', function(e){
            if(document.getElementById('id').value == ''){
                alert('제발 아이디 입력하세요');
                e.preventDefault(); // 폼 전송 막기
            }else if(document.getElementById('password').value == ''){
                alert('제발 비밀번호 입력하세요');
                e.preventDefault(); // 폼 전송 막기
            }else if(document.getElementById('password').value.length <= 5){
                alert('제발 6자 이상으로 비밀번호 입력하세요');
                e.preventDefault(); // 폼 전송 막기
            }
        });
</script>

Memo

1. 이벤트리스너 콜백함수에 'e'라는 파라미터 추가하고 e.preventDefault() 쓰면 폼 전송 할 수 없뜸
2. document.getElementById('태그').value == ''는 공백검사할 때 쓴다.
3. document.getElementById('password').value.length <= 5는 비밀번호 값이 6자 미만으로 들어왔을 경우 쓴다.