testchar.html
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 기기 별 출력 사이즈 맞춤 조절(데스크탑, 태블릿, 휴대폰 등) -->
<title>PHP Input Example</title>
</head>
<body>
<h1>Enter Text to Display</h1>
<form action="process.php" method="POST">
<label for="inputText">Enter text:</label>
<input type="text" id="inputText" name="inputText" required>
<label for="name">Enter name:</label>
<input type="text" id="name" name="name" required>
<button type="submit">Submit</button>
</form>
</body>
</html>
input.html
HTML
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- 유니코드 설정 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 디바이스에 맞게 출력 형태를 바꿔주는 형식 -->
<title>PHP Input Example</title>
</head>
<body>
<h1>Application Form_2</h1>
<br>
<form action="tableoutput2.php" method="POST">
<table>
<tr>
<td><label for="name">Enter your Name:</label></td>
<td><input type="text" id="name" name="name" required></td>
</tr>
<tr>
<td><label for="email">Enter your Email:</label></td>
<td><input type="text" id="email" name="email" required></td>
</tr>
<tr>
<td><label for="number">Enter your Number:</label></td>
<td><input type="text" id="number" name="number" required></td>
</tr>
<tr>
<td><label for="job">Enter your Job:</label></td>
<td><input type="text" id="job" name="job" required></td>
</tr>
<tr>
<td><label for="address">Enter your Address:</label></td>
<td><input type="text" id="address" name="address" required></td>
</tr>
<tr>
<td colspan="2" style="text-align: center;">
<button type="submit">Submit</button>
</td>
</tr>
</table>
</form>
</body>
</html>
timestable.html
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Times Table</title>
</head>
<body>
<h1>출력할 단을 선택하세요</h1>
<form action="timestableoutput.php" method="POST">
<label for="timestable">단수 선택:</label>
<select name="timestable" id="timestable">
<!-- select 태그는 콤보박스라고도 함 -->
<option value="2">2단</option>
<option value="3">3단</option>
<option value="4">4단</option>
<option value="5">5단</option>
<option value="6">6단</option>
<option value="7">7단</option>
<option value="8">8단</option>
<option value="9">9단</option>
</select>
<br>
<button type="submit">제출</button>
</form>
</body>
</html>
log.html
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>log Input Example</title>
</head>
<body>
<h1>로그도 씌워드립니다.</h1>
<form action="logoutput.php" method="POST">
<label for = "logbase">Enter Base(밑):</label>
<input type = "number" id="logbase" name="logbase" required>
<br>
<label for = "loginput">Enter Number(진수):</label>
<input type = "number" id="lognum" name="lognum" required>
<br>
<button type="submit">지수 계산하기</button>
</form>
</body>
</html>
MBTI.html
HTML
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- 유니코드 설정 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 디바이스에 맞게 출력 형태를 바꿔주는 형식 -->
<title>MBTI Input Example</title>
<!-- 스타일 시트 -->
<style>
body {
font-family: Arial, sans-serif;
background-color: #f9f9fc;
color: #333;
margin: 0;
padding: 20px;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
h1 {
color: #6a5acd;
}
form {
background-color: #ffffff;
border: 1px solid #dcdcdc;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
padding: 20px;
width: 100%;
max-width: 400px;
}
table {
width: 100%;
border-collapse: collapse;
}
td {
padding: 10px;
}
label {
color: #6a5acd;
}
select {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 5px;
background-color: #f3f3ff;
}
button {
background-color: #6a5acd;
color: white;
border: none;
border-radius: 5px;
padding: 10px 15px;
cursor: pointer;
width: 100%;
}
button:hover {
background-color: #5848c2;
}
</style>
</head>
<body>
<h1>MBTI 입력</h1>
<form action="mbtioutput3.php" method="POST" onsubmit="updateMBTI">
<table>
<tr>
<td><label for="Attitude1">Attitude1:</label></td>
<td>
<select name="attitude1" id="attitude1" onchange="updateMBTI()">
<!--option value="none" selected>=== 선택 ===</option-->
<option value="E" selected>Entroversion</option>
<option value="I">Introversion</option>
</select>
</td>
</tr>
<tr>
<td><label for="Attitude2">Attitude2:</label></td>
<td>
<select name="attitude2" id="attitude2" onchange="updateMBTI()">
<!--option value="none" selected>=== 선택 ===</option-->
<option value="S" selected>Sensing</option>
<option value="N">Intuition</option>
</select>
</td>
</tr>
<tr>
<td><label for="Function1">Function1:</label></td>
<td>
<select name="function1" id="function1" onchange="updateMBTI()">
<!--option value="none" selected>=== 선택 ===</option-->
<option value="T" selected>Thinking</option>
<option value="F">Feeling</option>
</select>
</td>
</tr>
<tr>
<td><label for="Function2">Function2:</label></td>
<td>
<select name="function2" id="function2" onchange="updateMBTI()">
<!--option value="none" selected>=== 선택 ===</option-->
<option value="J" selected>Judging</option>
<option value="P">Perceiving</option>
</select>
</td>
</tr>
</table>
<input type="text" id="mbti" name="mbti" readonly hidden>
<button type="submit">Submit</button>
</form>
<script>
function updateMBTI() {
const attitude1 = document.getElementById("attitude1").value;
const attitude2 = document.getElementById("attitude2").value;
const function1 = document.getElementById("function1").value;
const function2 = document.getElementById("function2").value;
document.getElementById("mbti").value = attitude1 + attitude2 + function1 + function2;
}
</script>
</body>
</html>