学生信息查询：输入姓名时，查询出全部同
名的学生记录，如下图所示。
学生信息查询
×
+
×
localhost:8080/chapter8/query.html Q
杨过
查询
学号姓名
班级
电话
地址
邮编
004004 杨过 日语11901
130123457
湖北武汉市八一路299号
730073
002002杨过电商12101
138111578
浙江杭州市教工路12号
310020
2.
技术要求：前端使用jQuery，后端使用Spring Boot+ R2dbcRepository，并基于Hazelcast实现分布式数据共享查询，即：模拟计算机集群中的多个节点，在一个节点查询得到的数据，可在另外若干节点实现共享。
分享
关注让 “紫雾凌寒” 来帮你回答,本回答结合 DeepSeek
如果还有问题，请评论或点击头像私信，如果有帮助到您, 请关注、采纳、点赞
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>学生信息查询</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>学生信息查询</h1>
<input type="text" id="nameInput" placeholder="请输入姓名">
<button onclick="queryStudent()">查询</button>
<table id="studentTable">
<thead>
<tr>
<th>学号</th>
<th>姓名</th>
<th>班级</th>
<th>电话</th>
<th>地址</th>
<th>邮编</th>
</tr>
</thead>
<tbody></tbody>
</table>
<script>
function queryStudent() {
const name = document.getElementById('nameInput').value;
// 这里使用fetch与后端进行交互
fetch('/query', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ name: name })
})
.then(response => response.json())
.then(data => {
const tableBody = document.getElementById('studentTable').querySelector('tbody');
tableBody.innerHTML = '';
data.forEach(student => {
const row = document.createElement('tr');
row.innerHTML = `
<td>${student.id}</td>
<td>${student.name}</td>
<td>${student.class}</td>
<td>${student.phone}</td>
<td>${student.address}</td>
<td>${student.postcode}</td>
`;
tableBody.appendChild(row);
});
});
}
</script>
</body>
</html>
- **CSS（styles.css）**：
body {
font-family: Arial, sans-serif;
}
h1 {
text-align: center;
}
input,
button {
padding: 10px;
margin: 5px;
}
table {
border-collapse: collapse;
width: 100%;
}
th,
td {
border: 1px solid black;
padding: 8px;
text-align: left;
}
from flask import Flask, request, jsonify
import sqlite3
app = Flask(__name__)
@app.route('/query', methods=['POST'])
def query_student():
data = request.get_json()
name = data.get('name')
conn = sqlite3.connect('students.db')
cursor = conn.cursor()
cursor.execute('SELECT * FROM students WHERE name =?', (name,))
students = cursor.fetchall()
student_list = []
for student in students:
student_dict = {
'id': student[0],
'name': student[1],
'class': student[2],
'phone': student[3],
'address': student[4],
'postcode': student[5]
}
student_list.append(student_dict)
conn.close()
return jsonify(student_list)
if __name__ == '__main__':
app.run(debug=True)
students.db的数据库文件。students的表：CREATE TABLE students (
id TEXT PRIMARY KEY,
name TEXT,
class TEXT,
phone TEXT,
address TEXT,
postcode TEXT
);
- 插入一些示例数据：
INSERT INTO students VALUES ('004004', '杨过', 'XX班', '1234567890', 'XX地址', '123456');
希望以上解答对您有所帮助。如果您有任何疑问，欢迎在评论区提出。
分享
创建了问题
11月12日
