你当前的 JSP 页面中，“选修课程”这一项使用了错误的 `
input` 类型：
```html
选修课程：
<
input type="cou">
```
这行代码是无效的，因为 `
type="cou"` 不是一个合法的 HTML `<
input>` 类型。你应该根据需求选择合适的表单控件来让用户选择“选修课程”，比如使用复选框（
checkbox）或多选下拉列表。
---
### ✅ 改进方案：将“选修课程”也用复选框（类似兴趣爱好）实现
以下是**修正并完善后的完整代码**，包括正确的“选修课程”选项：
```jsp
<%@ page content
Type="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>学生信息录入</title>
</head>
<body>
<h3 style="color
:blue">个人信息</h3>
<form action="stu_info
.jsp" method="post">
姓名：<
input type="text"
name="
name"><br><br>
学号：<
input type="text"
name="studentId"><br><br>
性别：
<
input type="radio"
name="gender"
value="男">男
<
input type="radio"
name="gender"
value="女">女<br><br>
所在专业：
<select
name="major">
<option
value="计算机软件专业" selected>计算机软件专业</option>
<option
value="网络工程专业">网络工程专业</option>
<option
value="信息安全专业">信息安全专业</option>
</select><br><br>
选修课程：
<
input type="
checkbox"
name="courses"
value="Java">Java
<
input type="
checkbox"
name="courses"
value="Web开发">Web开发
<
input type="
checkbox"
name="courses"
value="数据结构">数据结构
<
input type="
checkbox"
name="courses"
value="Python编程">Python编程<br><br>
兴趣爱好：
<
input type="
checkbox"
name="hobby"
value="编程">编程
<
input type="
checkbox"
name="hobby"
value="阅读">阅读
<
input type="
checkbox"
name="hobby"
value="运动">运动<br><br>
<
input type="submit"
value="提交">
<
input type="reset"
value="重置">
</form>
</body>
</html>
```
---
### 🔍 解释说明：
1
. **原问题修复**：
- 将 `<
input type="cou">` 改为多个带有 `
type="
checkbox"` 的选项，并设置 `
name="courses"`，这样可以提交多个选修课程。
2
. **多选处理机制**：
- 使用相同的 `
name`
属性（如 `courses` 和 `hobby`），JSP 后端可以通过 `request
.getParameter
Values("courses")`
获取字符串数组。
3
. **后端接收示例（stu_info
.jsp）**：
如果你想在提交后
显示这些数据，可以在 `stu_info
.jsp` 中添加如下代码：
```jsp
<%@ page content
Type="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>信息展示</title>
</head>
<body>
<h3>您提交的信息：</h3>
<%
request
.setCharacterEncoding("UTF-8");
String
name = request
.getParameter("
name");
String studentId = request
.getParameter("studentId");
String gender = request
.getParameter("gender");
String major = request
.getParameter("major");
String[] courses = request
.getParameter
Values("courses");
String[] hobbies = request
.getParameter
Values("hobby");
%>
姓名：<%=
name %><br>
学号：<%= studentId %><br>
性别：<%= gender %><br>
所在专业：<%= major %><br>
选修课程：
<%
if (courses != null) {
for (String course
: courses) {
out
.print(course + " ");
}
} else {
out
.print("无");
}
%><br>
兴趣爱好：
<%
if (hobbies != null) {
for (String hobby
: hobbies) {
out
.print(hobby + " ");
}
} else {
out
.print("无");
}
%><br>
<a href="index
.jsp">返回填写页面</a>
</body>
</html>
```
> 注意：确保页面编码一致，使用 `request
.setCharacterEncoding("UTF-8");` 防止中文乱码。
---
### ✅ 效果说明：
用户现在可以：
- 输入姓名、学号；
- 单选性别；
- 下拉选择专业；
- 多选“选修课程”和“兴趣爱好”；
- 提交后在 `stu_info
.jsp`
显示所选内容。
---
本文解释了如何在HTML中使用<label>标签与<inputtype=checkbox>关联，以便在Vue.js中正确显示city.cityName。强调了自闭合标签的用途和如何确保数据绑定有效。
扫一扫
1201
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
