一、前言
很多同学学到 JSP 第3章时,会觉得自己已经会了:
-
能写
<% %> -
能写
<%= %> -
能定义变量
-
能输出变量
但一到真正做题时,立刻就卡住:
-
for循环到底写在哪? -
为什么 HTML 标签总是要"断开写"
-
表格怎么一边循环一边输出
-
if 判断到底是控制页面显示还是控制 Java 逻辑
-
表单传过来的数据怎么参与循环
这其实说明一个问题:
你会的是"语法",但还不会"把语法拿来做页面程序"。
所以这一章的任务就是:
-
把
if -
把
for -
把表单参数
-
把 HTML 表格
这四样东西真正拼起来。
这一章学完后,你应该能独立完成这类最典型的课程题:
-
JSP 输出 9×9 表格
-
JSP 输出 9×9 乘法表
-
输入两个数并显示结果
-
输入行列数动态打印表格
-
输入姓名和行列数,提交后显示姓名并生成表格
这几乎就是《网络程序设计》入门阶段最核心的一批程序题。
二、为什么 JSP 做题总是"Java 一段、HTML 一段"
先看一个常见写法:
<%
for(int i = 1; i <= 3; i++){
%>
<h2>第 <%= i %> 行</h2>
<%
}
%>
很多新手第一眼会觉得很别扭:
-
为什么
for没写完整 -
为什么中间突然跳出去写 HTML
-
为什么后面又跳回来写
}
其实原因很简单:
1. for 是 Java 代码
所以必须写在:
<% %>
里面。
2. <h2> 是 HTML 标签
它不是 Java 语句,所以不能直接写在 Java 代码块里。
3. i 是变量值
要把它显示到页面上,就要用:
<%= i %>
所以 JSP 的本质节奏就是:
Java 控制流程
HTML 负责页面结构
<%= %>负责把值塞进 HTML
这正是 JSP 编程最核心的思维方式。
三、JSP 中 if 判断到底怎么用
先从最简单的 if 开始。
1. 基本写法
<%
int age = 20;
if(age >= 18){
%>
<h2>成年人</h2>
<%
}else{
%>
<h2>未成年人</h2>
<%
}
%>
2. 运行逻辑分析
第一步
在 <% %> 中定义变量 age
第二步
用 if(age >= 18) 进行判断
第三步
如果条件成立,就输出:
<h2>成年人</h2>
否则输出:
<h2>未成年人</h2>
3. 为什么不能直接这样写
很多人会想写成:
<%
if(age >= 18){
<h2>成年人</h2>
}
%>
这是错的。
因为:
-
<h2>成年人</h2>不是 Java 代码 -
它不能直接放在 Java 代码块内部
所以你必须"跳出" <% %> 再写 HTML。
4. if 最常见的用途
在 JSP 里,if 通常用于:
-
判断用户输入是否为空
-
判断数字是否合法
-
判断成绩是否及格
-
判断表单数据是否满足条件
-
判断是否显示某块页面内容
例如:
<%
String name = request.getParameter("username");
if(name != null && !name.equals("")){
%>
<h2>欢迎你:<%= name %></h2>
<%
}else{
%>
<h2>用户名不能为空!</h2>
<%
}
%>
四、JSP 中 for 循环怎么用
JSP 中最重要的循环就是 for。
因为:
-
打印表格用它
-
打印乘法表用它
-
打印重复行内容用它
-
动态生成列表也用它
1. 最基础的 for 输出
<%
for(int i = 1; i <= 5; i++){
%>
<h3>这是第 <%= i %> 行</h3>
<%
}
%>
运行效果类似:
这是第 1 行
这是第 2 行
这是第 3 行
这是第 4 行
这是第 5 行
2. 为什么输出变量要用 <%= i %>
因为 i 是 Java 变量。
想把它显示到 HTML 页面里,必须通过表达式输出。
如果你只写:
<h3>这是第 i 行</h3>
那页面上真的只会显示字母 i,不会自动识别成变量。
五、用 for 输出一个简单表格
先做一个过渡案例:输出一个 3 行 4 列表格。
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html>
<head>
<title>3行4列表格</title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="8">
<%
for(int i = 1; i <= 3; i++){
%>
<tr>
<%
for(int j = 1; j <= 4; j++){
%>
<td>第<%= i %>行第<%= j %>列</td>
<%
}
%>
</tr>
<%
}
%>
</table>
</body>
</html>
1. 代码结构解释
外层循环
for(int i = 1; i <= 3; i++)
表示控制 行数
内层循环
for(int j = 1; j <= 4; j++)
表示控制 列数
<tr>
每次外层循环开始,输出一行
<td>
每次内层循环执行,输出一个单元格
2. 规律总结
以后你只要看到"画 m 行 n 列表格",脑子里就自动联想到:
-
外层
for控制行 -
内层
for控制列 -
tr包住一整行 -
td是每个单元格
这几乎是固定模板。
六、JSP 输出 9×9 表格
这是课程里最基础、最经典的一题。
1. 题目要求
输出一个 9 行 9 列的表格,每个单元格都显示某个内容。
例如显示 i*j 的结果。
2. 完整代码
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html>
<head>
<title>9×9表格</title>
</head>
<body>
<h2>9×9 表格</h2>
<table border="1" cellspacing="0" cellpadding="8">
<%
for(int i = 1; i <= 9; i++){
%>
<tr>
<%
for(int j = 1; j <= 9; j++){
%>
<td><%= i * j %></td>
<%
}
%>
</tr>
<%
}
%>
</table>
</body>
</html>
3. 这一题练的是什么
这题不是单纯为了让你画个表格,而是在训练你同时掌握:
-
双重
for -
HTML 表格结构
-
JSP 表达式输出
-
Java 逻辑和 HTML 结构结合
所以它特别重要。
七、JSP 输出 9×9 乘法表
这题比"9×9 表格"再进一层,因为它不再是固定 9 列,而是一个三角形结构。
1. 效果要求
第一行:
1×1=1
第二行:
1×2=2 2×2=4
第三行:
1×3=3 2×3=6 3×3=9
依次类推,到第 9 行。
2. 完整代码
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html>
<head>
<title>9×9乘法表</title>
<style>
table { border-collapse: collapse; }
td { border: 1px solid #333; padding: 6px 10px; text-align: center; }
</style>
</head>
<body>
<h2>9×9乘法表</h2>
<table>
<%
for(int i = 1; i <= 9; i++){
%>
<tr>
<%
for(int j = 1; j <= i; j++){
%>
<td><%= j %> × <%= i %> = <%= i * j %></td>
<%
}
%>
</tr>
<%
}
%>
</table>
</body>
</html>
3. 为什么这里内层循环是 j <= i
这是关键。
如果写:
for(int j = 1; j <= 9; j++)
那每一行都是 9 列,变成矩形表格了。
而乘法表要求:
-
第1行 1列
-
第2行 2列
-
第3行 3列
-
...
-
第9行 9列
所以内层循环必须写:
for(int j = 1; j <= i; j++)
这里的 i 就决定了当前行该有多少列。
4. 这题的意义
这题在课程里很经典,因为它训练的是:
-
双重循环的控制关系
-
"外层控制行,内层控制当前行列数"的思想
-
表格结构的动态生成
你后面做很多题,本质都是这个模型的变种。
八、输入两个数字并求和显示
这一题开始把 表单 + request + JSP 输出 串起来。
1. 输入页面 input.jsp
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html>
<head>
<title>输入两个数字</title>
</head>
<body>
<h2>请输入两个数字</h2>
<form action="sum.jsp" method="post">
第一个数:<input type="text" name="num1"><br><br>
第二个数:<input type="text" name="num2"><br><br>
<input type="submit" value="求和">
</form>
</body>
</html>
2. 结果页面 sum.jsp
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%
request.setCharacterEncoding("UTF-8");
String s1 = request.getParameter("num1");
String s2 = request.getParameter("num2");
int num1 = 0;
int num2 = 0;
int sum = 0;
try{
num1 = Integer.parseInt(s1);
num2 = Integer.parseInt(s2);
sum = num1 + num2;
%>
<h2>两个数的和是:<%= sum %></h2>
<%
}catch(Exception e){
%>
<h2>输入有误,请输入整数!</h2>
<%
}
%>
3. 这题为什么容易出错
因为表单提交过来的数据,全都是:
String
即使你在输入框里输入的是 12,服务器接收到的仍然是 "12" 字符串。
所以要先转成整数:
Integer.parseInt(s1)
如果用户输入的是字母,比如 abc,就会报错,所以要配合 try-catch。
九、输入行列数,动态打印表格
这题是 JSP 程序设计的核心模板之一。
1. 输入页面 tableInput.jsp
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html>
<head>
<title>输入行列数</title>
</head>
<body>
<h2>请输入表格行数和列数</h2>
<form action="tableShow.jsp" method="post">
行数:<input type="text" name="row"><br><br>
列数:<input type="text" name="col"><br><br>
<input type="submit" value="生成表格">
</form>
</body>
</html>
2. 结果页面 tableShow.jsp
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%
request.setCharacterEncoding("UTF-8");
String rowStr = request.getParameter("row");
String colStr = request.getParameter("col");
int row = 0;
int col = 0;
boolean ok = true;
try {
row = Integer.parseInt(rowStr);
col = Integer.parseInt(colStr);
} catch (Exception e) {
ok = false;
}
%>
<html>
<head>
<title>动态表格</title>
<style>
table { border-collapse: collapse; }
td { border: 1px solid #333; padding: 8px 12px; text-align: center; }
</style>
</head>
<body>
<%
if(ok){
%>
<h2><%= row %> 行 <%= col %> 列表格如下:</h2>
<table>
<%
for(int i = 1; i <= row; i++){
%>
<tr>
<%
for(int j = 1; j <= col; j++){
%>
<td><%= i %>,<%= j %></td>
<%
}
%>
</tr>
<%
}
%>
</table>
<%
}else{
%>
<h2>输入有误,请输入整数!</h2>
<%
}
%>
</body>
</html>
3. 这题的核心思想
这道题你一定要吃透,因为它是很多作业题的母题。
本质上做了 4 件事:
第一步:接收参数
request.getParameter("row")
request.getParameter("col")
第二步:字符串转整数
Integer.parseInt(...)
第三步:if 判断是否输入有效
if(ok)
第四步:双重 for 输出表格
-
外层控制行
-
内层控制列
十、输入姓名和行列数,提交后显示姓名并生成表格
这题是老师和教材特别喜欢出的综合题,因为它把"字符数据 + 数字数据 + 表单提交 + 动态表格"全合在一起了。
1. 输入页面 form.jsp
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html>
<head>
<title>输入姓名和表格参数</title>
</head>
<body>
<h2>请输入姓名、行数和列数</h2>
<form action="result.jsp" method="post">
姓名:<input type="text" name="username"><br><br>
行数:<input type="text" name="row"><br><br>
列数:<input type="text" name="col"><br><br>
<input type="submit" value="提交">
</form>
</body>
</html>
2. 结果页面 result.jsp
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%
request.setCharacterEncoding("UTF-8");
String username = request.getParameter("username");
String rowStr = request.getParameter("row");
String colStr = request.getParameter("col");
int row = 0;
int col = 0;
boolean ok = true;
try {
row = Integer.parseInt(rowStr);
col = Integer.parseInt(colStr);
} catch (Exception e) {
ok = false;
}
%>
<html>
<head>
<title>结果页面</title>
<style>
table { border-collapse: collapse; }
td { border: 1px solid #333; padding: 8px 12px; text-align: center; }
</style>
</head>
<body>
<h2>欢迎你:<%= username %></h2>
<%
if(ok){
%>
<table>
<%
for(int i = 1; i <= row; i++){
%>
<tr>
<%
for(int j = 1; j <= col; j++){
%>
<td>欢迎 <%= username %></td>
<%
}
%>
</tr>
<%
}
%>
</table>
<%
}else{
%>
<h3>行数或列数输入错误,请输入整数!</h3>
<%
}
%>
</body>
</html>
3. 这一题综合了什么
这题把前几章知识真正连起来了:
-
HTML 表单
-
POST 提交
-
request.getParameter() -
中文字符接收
-
Integer.parseInt() -
if -
双重
for -
JSP 输出
如果你这题能自己独立写出来,说明前 1~4 章已经学得比较扎实了。
十一、为什么输入字母会报错
这也是你之前反复问过的一个高频问题。
比如用户输入:
-
row = a -
col = b
然后你写:
row = Integer.parseInt(rowStr);
col = Integer.parseInt(colStr);
这里就会报错。
因为:
Integer.parseInt()
只能把"看起来像整数的字符串"转换成整数,比如:
-
"3"可以 -
"10"可以 -
"a"不可以 -
"3.5"也不可以
所以为了避免程序直接崩掉,才要用:
try {
row = Integer.parseInt(rowStr);
col = Integer.parseInt(colStr);
} catch (Exception e) {
ok = false;
}
这段代码的作用就是:
如果转换成功,继续执行
如果转换失败,说明输入不合法,不让程序崩掉,而是提示用户输入错误
十二、为什么有时候页面会多出奇怪的符号或大括号
很多同学写 JSP 表格时,页面会多出:
-
} -
}}}} -
半截标签
-
表格结构错乱
最常见原因就这几个:
1. Java 代码块没闭合
例如:
<%
for(int i = 1; i <= 3; i++){
%>
<tr><td>xxx</td></tr>
后面忘了写:
<%
}
%>
2. HTML 写进了错误的位置
例如把 <tr>、<td> 塞进 Java 代码里。
3. 大括号和 %> 对不上
JSP 最容易乱的不是语法本身,而是:
-
{ -
} -
<% -
%>
这四组东西交叉嵌套。
所以你写 JSP 循环时,最好养成这个习惯:
-
for(...) {单独占一行 -
}单独占一行 -
HTML 结构按层次缩进
-
一看到表格错乱,就先检查
tr、td、}有没有对齐
十三、本章最常用的 4 个题型模板
你学这章,不只是学几个例子,而是要脑子里形成模板。
模板1:重复输出内容
<%
for(int i = 1; i <= n; i++){
%>
输出内容
<%
}
%>
模板2:if 控制显示
<%
if(条件){
%>
显示内容A
<%
}else{
%>
显示内容B
<%
}
%>
模板3:矩形表格
<table border="1">
<%
for(int i = 1; i <= row; i++){
%>
<tr>
<%
for(int j = 1; j <= col; j++){
%>
<td>...</td>
<%
}
%>
</tr>
<%
}
%>
</table>
模板4:三角形乘法表
<table border="1">
<%
for(int i = 1; i <= 9; i++){
%>
<tr>
<%
for(int j = 1; j <= i; j++){
%>
<td><%= j %>×<%= i %>=<%= i*j %></td>
<%
}
%>
</tr>
<%
}
%>
</table>
十四、本章你必须记住的 10 个结论
-
JSP 中的
if和for都必须写在<% %>里。 -
HTML 标签不能直接写进 Java 代码块内部。
-
想在 HTML 中显示变量值,必须用
<%= %>。 -
外层
for通常控制行,内层for通常控制列。 -
动态表格本质就是"双重循环 + table/tr/td"。
-
9×9 乘法表和普通 9×9 表格的区别,在于内层循环条件不同。
-
表单提交的数据默认是字符串。
-
数字字符串要参与计算,通常先
Integer.parseInt()。 -
输入非法字符时,要用
try-catch防止程序报错。 -
JSP 做题最核心的能力,不是背语法,而是把"Java 逻辑 + HTML 页面"拼起来。
十五、本章练习题
练习1
用 JSP 输出 10 行"Hello JSP"。
练习2
用 JSP 输出一个 5 行 6 列的表格,每个单元格显示当前行号和列号。
练习3
用 JSP 输出 9×9 乘法表。
练习4
做一个输入两个整数的页面,提交后显示它们的和。
练习5
做一个输入姓名、行数、列数的页面,提交后显示姓名并生成对应表格。
十六、本章小结
这一章你真正开始进入了"JSP 程序设计"阶段。
前面第3章更多是在认识 JSP 语法,
而这一章开始,你已经在做真正的页面程序:
-
用
if控制显示内容 -
用
for动态生成页面 -
用双重循环画表格
-
用表单提交参数
-
用
request接收数据 -
用
Integer.parseInt()处理数字输入 -
用
try-catch处理错误输入
所以这一章非常重要。
因为很多老师出的 JSP 基础题,本质都逃不过这几个模型。
你把这一章吃透,课程前半段的程序设计题基本就有底了。