회원가입 페이지 만들기
- 다음과 같은 페이지를 작성하시오
join.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>회원 가입 폼</title>
<script src="js/checkForm.js"></script>
</head>
<body>
<div id="wrap">
<div id="joinBox">
<h2 align="center">회원가입</h2>
<hr>
<form name="joinForm" id="joinForm" method="post" action="joinMemberOk.jsp">
<table align="center">
<tr>
<td>성명</td>
<td><input type="text" name="name" id="name"></td>
</tr>
<tr>
<td>아이디</td>
<td><input type="text" name="id" id="id" border=0>
<input type="button" value="ID중복체크"> (영문자+특수문자: 6~10자)</td>
</tr>
<tr>
<td>비밀번호</td>
<td><input type="password" name="password" id="password" size="21">
(영문자+숫자+특수문자: 10~20자)</td>
</tr>
<tr>
<td>비밀번호 확인</td>
<td><input type="password" name="passwordCheck" id="passwordCheck" size="21"></td>
</tr>
<tr>
<td>생년월일 </td>
<td>
<input type="text" name="birthYear" id="birthYear" size="4">년
<select name="birthMonth">
<option value="1">1
<option value="2">2
<option value="4">3
<option value="4">4
<option value="5">5
<option value="6">6
<option value="7">7
<option value="8">8
<option value="9">0
<option value="10">10
<option value="11">11
<option value="12">12
</select> 월
<select name="birthDay">
<option value="1">1
<option value="2">2
<option value="4">3
<option value="4">4
<option value="5">5
<option value="6">6
<option value="7">7
<option value="8">8
<option value="9">0
<option value="10">10
<option value="11">11
<option value="12">12
<option value="13">13
<option value="14">14
<option value="15">15
<option value="16">16
<option value="17">17
<option value="18">18
<option value="19">19
<option value="20">20
<option value="21">21
<option value="22">22
<option value="23">23
<option value="24">24
<option value="25">25
<option value="26">26
<option value="27">27
<option value="28">28
<option value="29">29
<option value="30">30
<option value="31">31
</select> 일
<input type="radio" name="solar" value="양력" checked>양력
<input type="radio" name="solar" value="음력">음력
</td>
</tr>
<tr>
<td>전화번호 </td>
<td><select name="tel1">
<option value="02" selected>02
<option value="031">031
<option value="043">043
</select>
- <input type="text" name="tel2" id="tel2" size="4">
- <input type="text" name="tel3" id="tel3"size="4">
</td>
</tr>
<tr>
<td>휴대폰번호 </td>
<td><select name="hp1">
<option value="000">000
<option value="010" selected>010
</select>
- <input type="text" name="hp2" id="hp2"size="4">
- <input type="text" name="hp3" id="hp3"size="4">
</td>
</tr>
<tr>
<td>주소 </td>
<td><input type="text" name="zipcode" id="zipcode" readonly>
<input type="button" value="우편번호찾기"><br>
<input type="text" name="address1" id="address1" size="40" readonly><br>
<input type="text" name="address2" id="address2" size="40">상세 주소 입력
</td>
</tr>
<tr>
<td>성별</td>
<td>
<input type="radio" name="sex" value="남" checked>남
<input type="radio" name="sex" value="여">여
</td>
</tr>
<tr>
<td valign="top">직업</td>
<td>
<select id="job" name="job">
<option value="직업선택">직업선택
<option value="웹디자이너">웹디자이너
<option value="프로그래머">프로그래머
<option value="회사원">회사원
<option value="학생">학생
<option value="영화감독">영화감독
<option value="웹마스터">웹마스터
</select>
</td>
</tr>
<tr>
<td valign="top">이메일</td>
<td>
<input type="text" name="email1" id="email1" size="6">@<select name="email">
<option value="naver" selected>naver.com
<option value="gmail">gmail.com
<option value="nate">nate.com
<option value="hanmail">hanmail.net
</select>
</td>
</tr>
<tr>
<td>이메일 수신 여부</td>
<td>
<input type="radio" name="emailRcv" value="yes">예
<input type="radio" name="emailRcv" value="no">아니오
</td>
</tr>
<tr>
<td>동의</td>
<td>
<label><input type="checkbox" id="agreement1" value="모든약관">예</label>
<label><input type="checkbox" id="agreement2" value="개인정보">아니오</label>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="회원가입">
<input type="reset" value="취 소">
</td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>
'Front > HTML' 카테고리의 다른 글
HTML - HTML5 시멘틱 구조 태그 (0) | 2021.12.05 |
---|---|
HTML - 공간 분할 태그 (0) | 2021.12.05 |
HTML - 입력 양식 태그 (0) | 2021.12.05 |
HTML - 문서 삽입 태그, 오디오/비디오 태그 (0) | 2021.12.05 |
HTML - 이미지 태그 (0) | 2021.12.05 |