녕지의 개발 블로그

강사님이 주신 html을 공부하다가 form 태그에 작성되는 onsubmit의 정의가 생각나지 않아 찾아보았다...

<form id="loginForm" action="<%=request.getContextPath() %>/loginMember.do" 
 method="post" onsubmit="return loginValidate();">	
    <table>
        <tr>
            <td><input id="userId" type="text" name="userId" placeholder="아이디"></td>
            <td rowspan="2">
                <button type="submit" id="loginBtn">로그인</button>
            </td>				
        </tr>				
        <tr>
            <td><input id="userPwd" type="password" name="userPwd" placeholder="비밀번호"></td>
        </tr>
    </table>
</form>

위와 같은 코드에서 onsubmit="return loginValidate();"와 같은 이벤트를 사용해 주고 있는데

submit 버튼을 누르면 loginValidate() 이벤트를 반드시 실행시켜 준다

function loginValidate(){
		if($("#userId").val().trim().length === 0) {
			alert("아이디를 입력하세요 ");
			$("#userId").focus();
			return false;
		}
		
		if($("#userPwd").val().trim().length === 0) {
			alert("비밀번호를 입력하세요 ");
			$("#userPwd").focus();
			return false;
		}
		return true;
	}

return 값이 false일 경우 다음 화면으로 넘어가지 않는다!

'Language > html' 카테고리의 다른 글

HTML 유튜브 링크 가져오기  (0) 2022.02.11
profile

녕지의 개발 블로그

@녕지

주니어 개발자가 쓰는 IT에서 살아남기 . . .