You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
3.1/crazymode.html 疯狂模式

112 lines
7.4 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="styles.css">
<style>
/* 其他样式保持不变 */
.login-button {
cursor: pointer; /* 将鼠标指针设置为点击状态 */
}
.sign-up-link {
cursor: pointer;
color: black;
font-size: 20px;
font-family: Inter;
font-weight: 500;
text-decoration: none; /* 去掉超链接的下划线 */
}
</style>
<script>
function redirectToPage() {
window.location.href = 'page.html'; //
}
</script>
</head>
<body>
<div style="width: 100vw; height: auto; position: relative; background: #FAFAF9">
<img style="width: 100vw; height: auto; top: 105px; position: absolute" src="E:\softwareengineer\work2\frontend\assets\d3.png" />
<div style="width: 100vw; height: 105px; left: 0px; top: 0px; position: absolute; background: #E7642A"></div>
<div style="width: 182px; height: 182px; left: 27%; top: 234px; position: absolute" class="login-button" onclick="redirectToimport()">
<div style="width: 182px; height: 182px; left: 0px; top: 0px; position: absolute; background: #FFB812; border-radius: 40px; border: 2px black dotted"></div>
<div style="width: 104px; height: 106px; left: 39px; top: 22px; position: absolute; border-radius: 40px; overflow: hidden">
<img style="width: 69.33px; height: 83.92px; left: 17.33px; top: 8.83px; position: absolute" src="E:\softwareengineer\work2\frontend\emoji\download1.png" />
</div>
<div style="width: 80px; height: 28px; left: 51px; top: 128px; position: absolute; color: black; font-size: 20px; font-family: Inter; font-weight: 400; word-wrap: break-word">导入名单</div>
</div>
<div style="width: 182px; height: 182px; left: 27%; top: 554px; position: absolute" class="login-button" onclick="redirectToexport()">
<div style="width: 182px; height: 182px; left: 0px; top: 0px; position: absolute; background: #FFB812; border-radius: 40px; border: 2px black dotted"></div>
<div style="width: 80px; height: 28px; left: 51px; top: 131px; position: absolute; color: black; font-size: 20px; font-family: Inter; font-weight: 400; word-wrap: break-word">导出名单</div>
<div style="width: 104px; height: 106px; left: 39px; top: 25px; position: absolute">
<img style="width: 69.33px; height: 83.92px; left: 17.33px; top: 8.83px; position: absolute" src="E:\softwareengineer\work2\frontend\emoji\export1.png" />
</div>
</div>
<div style="width: 182px; height: 182px; left: 60%; top: 234px; position: absolute" class="login-button" onclick="redirectTorollname()">
<div style="width: 182px; height: 182px; left: 0px; top: 0px; position: absolute; background: #FFB812; border-radius: 40px; border: 2px black dotted"></div>
<div style="width: 80px; height: 28px; left: 51px; top: 128px; position: absolute; color: black; font-size: 20px; font-family: Inter; font-weight: 400; word-wrap: break-word">随机点名</div>
<div style="width: 104px; height: 106px; left: 39px; top: 22px; position: absolute">
<img style="width: 60.67px; height: 88.33px; left: 21.67px; top: 8.83px; position: absolute" src="E:\softwareengineer\work2\frontend\emoji\rollname1.png" />
</div>
</div>
<div style="width: 182px; height: 182px; left: 60%; top: 554px; position: absolute" class="login-button" onclick="redirectTocrazy()">
<div style="width: 182px; height: 182px; left: 0px; top: 0px; position: absolute; background: #FFB812; border-radius: 40px; border: 2px black dotted"></div>
<div style="width: 80px; height: 28px; left: 52px; top: 131px; position: absolute; color: black; font-size: 20px; font-family: Inter; font-weight: 400; word-wrap: break-word">疯狂模式</div>
<div style="width: 104px; height: 106px; left: 39px; top: 25px; position: absolute">
<img style="width: 78px; height: 79.50px; left: 13px; top: 13.25px; position: absolute" src="E:\softwareengineer\work2\frontend\emoji\crazy1.png" />
</div>
</div>
<div style="width: 481px; height: 93px; left: 5%; top: -9px; position: absolute; color: white; font-size: 96px; font-family: Alfa Slab One; font-weight: 400; word-wrap: break-word">FUClass</div>
<a href="log_in.html" style="width: 83px; height: 29px; left: 90%; top: 67px; position: absolute; color: white; font-size: 24px; font-family: Inter; font-style: italic; font-weight: 400; word-wrap: break-word; text-decoration: none;">log out</a>
</div>
<div style="width: 100%; height: 950px; left: 0px; top: 110px; position: absolute; opacity: 0.70; background: #D9D9D9" class="login-button" onclick="redirectToPage()"></div>
<div style="width: 476px; height: 431px; left: 35%; top: 201px; position: absolute; background: #FAFAFA; border-radius: 30px; border: 1px black solid">
<div style="left: 30%; top: 10px; position: absolute; color: black; font-size: 32px; font-family: Inter; font-weight: 400; word-wrap: break-word">疯狂模式说明</div>
<div style="width: 350px; left: 14%; top: 100px; position: absolute; color: #525151; font-size: 22px; font-family: Inter; font-weight: 400; word-wrap: break-word">输入一个0~9的任意数字学号尾号为该数字的同学被点到的概率增加</div>
<div style="width: 349px; height: 50px; left: 32%; top: 250px; position: absolute">
<form id="Snum">
<div class="input-container">
<label for="Snumber" style="left: 0px; top: -30px; position: absolute; color: black; font-size: 20px; font-family: Inter; font-weight: 500; word-wrap: break-word">请输入:</label>
<input type="text" id="number" name="number" style="width: 180px; height: 20px" required><br><br>
</div>
</div>
<div style="width: 476px; height: 0px; left: 0px; top: 350px; position: absolute; border: 1px black solid"></div>
<button type="submit" style="width: 82px; height: 44px; left: 41%; top: 360px; position: absolute; color: #2499F8; font-size: 30px; font-family: Inter; font-weight: 500; word-wrap: break-word; text-decoration: none">确认</button>
</form>
</div>
</div>
<script>
// 获取标签和输入字段
var label = document.querySelector('.input-label');
var input = document.querySelector('.input-field');
document.getElementById('Snum').addEventListener('submit', function(event) {
event.preventDefault(); // 阻止表单默认提交行为
const formData = {
Number: document.getElementById('number').value,
};
fetch('/api/Snum-data', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(formData)
})
.then(response => response.json())
.then(data => {
console.log('Success:', data);
// 数据提交成功后跳转
window.location.href = 'E:\softwareengineer\work2\frontend\rollname.html';
})
.catch((error) => {
console.error('Error:', error);
// 数据提交失败时跳转
alert('上传失败!');
});
});
</script>
</body>
</html>