회원 가입
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>회원 가입</title>
<style>
/* 기본 페이지 스타일 */
body {
font-family: 'Arial', sans-serif;
background-color: #f8f9fa;
text-align: center;
margin: 50px;
}
/* 콘텐츠 박스 스타일 */
.container {
background: white;
padding: 30px;
border-radius: 10px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
display: inline-block;
}
/* 테이블 스타일 */
table {
width: 700px;
border-collapse: collapse;
margin: auto;
background-color: white;
}
td {
padding: 10px;
}
/* 필수 입력 필드 강조 */
.required {
background-color: #FFFF99;
}
/* 버튼 스타일 */
.btn {
padding: 10px 15px;
border: none;
color: white;
background-color: #28a745;
border-radius: 5px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
}
.btn:hover {
background-color: #218838;
}
.btn-reset {
background-color: #dc3545;
}
.btn-reset:hover {
background-color: #c82333;
}
</style>
<script>
// 회원가입 입력값 체크
function chk_input() {
let form = document.user_form;
if (form.fuserid.value == "") {
alert("아이디를 입력하시오.");
form.fuserid.focus();
return false;
} else if (form.fname.value == "") {
alert("이름을 입력하시오.");
form.fname.focus();
return false;
} else if (form.fpasswd.value == "") {
alert("비밀번호를 입력하시오.");
form.fpasswd.focus();
return false;
} else if (form.fpasswd_re.value == "") {
alert("비밀번호 확인을 입력하시오.");
form.fpasswd_re.focus();
return false;
} else if (form.fpasswd.value !== form.fpasswd_re.value) {
alert("[비밀번호 입력 오류] \n비밀번호를 다시 입력하시오.");
form.fpasswd.value = "";
form.fpasswd_re.value = "";
form.fpasswd.focus();
return false;
}
return true;
}
// 아이디 중복 검사
function chk_id() {
let form = document.user_form;
if (form.fuserid.value == '') {
alert('ID를 입력하세요.');
form.fuserid.focus();
} else {
window.open('id_chk.php?fuserid=' + form.fuserid.value, 'IDwin', 'width=400, height=200');
}
}
</script>
</head>
<body>
<div class="container">
<h2><?php echo "회원 가입"; ?></h2>
<hr>
<!-- 로그인 페이지 이동 링크 -->
<p>[ <a href="login_form.php">로그인</a> ]</p>
<form name="user_form" action="add_db.php" method="post" onsubmit="return chk_input()">
<table border="1">
<tr>
<td colspan="2" bgcolor="gray" style="color: white;">
<b>회원 가입</b> [* 표시는 필수 입력 항목입니다.]
</td>
</tr>
<!-- 아이디 입력 -->
<tr>
<td class="required" width="20%"><p align="right"> * 아이디 </p></td>
<td width="80%">
<input type="text" name="fuserid" id="fuserid" size="12" maxlength="12">
<input type="button" class="btn" value="중복검사" onclick="chk_id();">
<font size="2">(영문과 숫자 12자리까지)</font>
</td>
</tr>
<!-- 이름 입력 -->
<tr>
<td class="required"><p align="right"> * 이름 </p></td>
<td><input type="text" name="fname" id="fname" size="12" maxlength="10">
<font size="2">(최대 5글자)</font>
</td>
</tr>
<!-- 비밀번호 입력 -->
<tr>
<td class="required"><p align="right"> * 비밀번호 </p></td>
<td><input type="password" name="fpasswd" id="fpasswd" size="12" maxlength="10">
<font size="2">(영문과 숫자 혼합 10자리까지)</font>
</td>
</tr>
<!-- 비밀번호 확인 -->
<tr>
<td class="required"><p align="right"> * 비밀번호 확인 </p></td>
<td><input type="password" name="fpasswd_re" id="fpasswd_re" size="12" maxlength="10">
<font size="2">(비밀번호와 동일하게 입력)</font>
</td>
</tr>
<!-- 성별 선택 -->
<tr>
<td><p align="right"> 성별 </p></td>
<td>
<input type="radio" name="fsex" value="M" checked> 남
<input type="radio" name="fsex" value="W"> 여
</td>
</tr>
<!-- 이메일 입력 -->
<tr>
<td><p align="right"> 이메일 </p></td>
<td><input type="text" name="femail" size="30" maxlength="30">
<font size="2">(예: test@test.com)</font>
</td>
</tr>
<!-- 가입 및 초기화 버튼 -->
<tr>
<td colspan="2" align="center">
<input type="submit" class="btn" name="smt" value="가입하기">
<input type="reset" class="btn btn-reset" name="rst" value="다시작성">
</td>
</tr>
</table>
</form>
</div>
</body>
</html>
https://www.yes24.com/Product/Goods/19584929
이 코드는 책 "PHP 프로그래밍 정복"의 내용을 참고하여, 최신 PHP 버전에 맞게 수정하였습니다.
이전 글
'웹 개발' 카테고리의 다른 글
[PHP] 회원가입에서 아이디 중복 체크 (0) | 2025.02.24 |
---|---|
[PHP] 회원 관리 프로그램 제작 성공 화면 (0) | 2025.02.19 |
[PHP] 관리자 페이지 제작 & DB 접속 (0) | 2025.02.13 |
[APM] Ubuntu 22.04 APM 설치 (0) | 2025.02.10 |
Cookie & Session (0) | 2025.01.23 |