[1] JavaScript & JQuery - click() 이벤트, val()

[ 환경 ]
ㄴ php 7 
ㄴ JQuery 1.11.1

---

1. 로그인 form 수정

ㄴ 로그인 폼 안에 아이디,비밀번호, 로그인버튼 일부 변경
- 인풋 2개 클래스값 추가 / 로그인 버튼타입 변경 & 클래스 값 추가

2. JQuery 코드 작성

// 제이쿼리
	$(function(){
	    $(".loginbtn").click(function(){

		var id = $(".id").val(); // 아이디
		var password = $(".password").val(); // 비밀번호

		// 아이디 체크
		if(!id){
			alert("아이디를 입력해주시기 바랍니다.");
			return false;
		}

		// 비밀번호 체크
		if(!password){
			alert("비밀번호를 입력해주시기 바랍니다.");
			return false;
		}

		$("form").submit(); // 로그인 form submit 전송
	    });
	})

ㄴ 아이디, 비밀번호 인풋 클래스의 value값 변수 선언 / 변수로 아이디 비밀번호 체크

ㄴ button type submit -> button으로 변경하였으므로, submit() 진행.

 

3. 사이트(기능) 확인

ㄴ 아이디 미입력 후 로그인버튼 클릭 시

ㄴ 비밀번호 미입력 후 로그인버튼 클릭 시

 

ㄴ 정상 로그인 완료