实训项目一:利用request对象获取表单提交信息
制作一个用户信息提交页面,如下所示:
注意内容:
要解决其中的多项选择“爱好”这一项的信息获取,需要采用到数组,使用方法如下:
String 数组1[]=request.getParameterValues(“输入框名”);
提交的信息便存储进入数组1中,输出时候使用循环即可。
用户填写完成后完成,提交到另一个页面,将用户信息显示出来,如下示:
效果图:
要求:
1.页面提交的用户姓名为中文,不能出现乱码
2.表单中的多项选择内容要求正确显示
代码部分:
Excises01.jsp
<form action="实训三——项目1.jsp" method="post"><!-- 定义供用户输入的 HTML 表单。 -->
<!-- align 属性规定段落中文本的对齐方式。center表示居中对齐 -->
<p algin="center">学生信息登录系统</p>
<tr><!-- 第一行 -->
<td>姓名:</td><!-- 第一列 -->
<td><input type="text" name="name"></td><!-- 第二列 -->
</tr>
<br><!-- 换行 -->
<tr><!-- 第二行 -->
<td>性别:</td><!-- 第一列 -->
<td>男<input type="radio" name="sex" value="男"><!-- type="radio"表示可返回单选按钮-->
女<input type="radio" name="sex" value="女">
</td><!-- 第二列 -->
</tr>
<br><!-- 换行 -->
<tr><!-- 第三行 -->
<td>爱好:</td><!-- 第一列 -->
<td><input type="checkbox" name="hobby" value="足球">足球
<input type="checkbox" name="hobby" value="计算机">计算机
<input type="checkbox" name="hobby" value="音乐">音乐</td><!-- 第二列 -->
</tr>
<br><!-- 换行 -->
<tr><!-- 第四行 -->
<td>学校:</td>
<td>
<select name="school"><!--多选框控件 -->
<option value="武汉理工大学">武汉理工大学</option>
<option value="华中师范大学">华中师范大学</option>
<option value="华中科技大学">华中科技大学</option>
<option value="武汉大学">武汉大学</option>
<option value="中国地质大学">中国地质大学</option>
<option value="长江大学">长江大学</option>
<option value="武汉科技大学">武汉科技大学</option>
</select>
</td>
</tr>
<br><!-- 换行 -->
<tr><!-- 第五行 -->
<td>备注:</td>
<td>
<textarea name="beizhu" rows="5", cols="20">
</textarea><!-- textarea标签定义多行的文本输入控件。 -->
<button type="submit" >提交</button><!--定义按钮。 -->
</td>
</tr>
</form>
实训三——项目1.jsp
</head>
<%
request.setCharacterEncoding("UTF-8");
String name=request.getParameter("name");
String sex=request.getParameter("sex");
String []information=request.getParameterValues("hobby");
String beizhu=request.getParameter("beizhu");
String school=request.getParameter("school");
%>
<body>
<p algin="center">学生信息</p><!-- align 属性规定 div 元素中的内容的水平对齐方式。 -->
<table algin="center">
<tr>
<td>姓名: </td>
<td><input type="text" value="<%=name%>"> </td>
</tr>
<br>
<tr>
<td>性别: </td>
<td><input type="text" value="<%=sex%>"> </td>
</tr>
<br>
<tr>
<td>爱好是: </td>
<td><%
for(int i=0;i<information.length;i++)
out.print(information[i]+" ");
%></td>
</tr>
<br>
<tr>
<td>学校是: </td>
<td><input type="select" value="<%=school%>"> </td>
</tr>
<br>
<tr>
<td>您的备注信息是: </td>
<td><input type="text" value="<%=beizhu%>"> </td>
</tr>
</table>
</body>
效果图:
Excises01.jsp
实训三——项目1.jsp
实训项目二:request对象与response对象应用
在前面实验一的基础上,在用户名下添加一项密码,编写程序实现,若用户提交的用户名或密码为空的时候,提示有关错误信息,并跳转回用户信息填写页面,若信息不为空,则跳转到欢迎页面,显示XX用户,欢迎您,并在该页面输出请求数据及请求的一些相关信息:request.getProtocol(),request.getServletPath(),request.getMethod(),request.getRemoteAddr()等参考教材P56。
代码部分:
Excises02.jsp
<form action="实训三——项目2.jsp" method="post"><!-- 定义供用户输入的 HTML 表单。 -->
<!-- align 属性规定段落中文本的对齐方式。center表示居中对齐 -->
<p algin="center">学生信息登录系统</p>
<tr><!-- 第一行 -->
<td>姓名:</td><!-- 第一列 -->
<td><input type="text" name="name"></td><!-- 第二列 -->
</tr>
<br><!-- 换行 -->
<tr>
<td>密码:</td><!-- 在姓名下插入的密码 -->
<td><input type="password" name="password"></td>
</tr>
<br>
<tr><!-- 第二行 -->
<td>性别:</td><!-- 第一列 -->
<td>男<input type="radio" name="sex" value="男"><!-- type="radio"表示可返回单选按钮-->
女<input type="radio" name="sex" value="女">
</td><!-- 第二列 -->
</tr>
<br><!-- 换行 -->
<tr><!-- 第三行 -->
<td>爱好:</td><!-- 第一列 -->
<td><input type="checkbox" name="hobby" value="足球">足球
<input type="checkbox" name="hobby" value="计算机">计算机
<input type="checkbox" name="hobby" value="音乐">音乐</td><!-- 第二列 -->
</tr>
<br><!-- 换行 -->
<tr><!-- 第四行 -->
<td>学校:</td>
<td>
<select name="school"><!--多选框控件 -->
<option value="武汉理工大学">武汉理工大学</option>
<option value="华中师范大学">华中师范大学</option>
<option value="华中科技大学">华中科技大学</option>
<option value="武汉大学">武汉大学</option>
<option value="中国地质大学">中国地质大学</option>
<option value="长江大学">长江大学</option>
<option value="武汉科技大学">武汉科技大学</option>
</select>
</td>
</tr>
<br><!-- 换行 -->
<tr><!-- 第五行 -->
<td>备注:</td>
<td>
<textarea name="beizhu" rows="5", cols="20">
</textarea><!-- textarea标签定义多行的文本输入控件。 -->
<button type="submit" >提交</button><!--定义按钮。 -->
</td>
</tr>
</form>
实训三——项目2.jsp
<%
request.setCharacterEncoding("UTF-8");
String name=request.getParameter("name");
String sex=request.getParameter("sex");
String []information=request.getParameterValues("hobby");
String beizhu=request.getParameter("beizhu");
String school=request.getParameter("school");
String password=request.getParameter("password");//新插入的密码模块
if(name==""||password=="")
{
%>
<script type="text/javascript">
alert("输入信息为空,请重新输入!");
//JavaScript脚本语言区域,alert表示以弹窗的形式输出
</script>
<%
response.setHeader("refresh","2;url=Excises02.jsp");
<!-- response对象,用来重定向页面,2表示两秒后刷新-->
}
else
{
out.print(name+"用户,欢迎您!</br>");
out.print("协议及版本号"+request.getProtocol()+"</br>");
out.print("请求方式"+request.getMethod()+"</br>");
out.print("IP地址"+request.getRemoteAddr()+"</br>");
out.print("Web服务目录部分值"+request.getServletPath()+"</br>");
out.print("URL"+request.getRequestURL());
}
%>
效果图:
实训三——项目2.jsp
未输入用户名和密码:
输入用户名和密码:
实训项目三:request对象应用
编写JSP程序,实现简易计算器,要求:输入“第一个参数”,选择运算类型:加减乘除,输入第二个参数,按“计算”按钮,结果显示在“结果”文本框中。
代码部分:
Excises03.jsp
<%--使用js验证输入的两种方式,①在form属性中验证onsubmit; ②在按钮事件中验证onclick --%>
<form action="实训三——项目3.jsp" method="post" onsubmit="return check">
请输入第一个数:<input type="text" id="num1" name="num1">
<br>
请输入第二个数:<input type="text" id="num2" name="num2">
<br>
请选择要进行的操作:<select name="op">
<option>+</option>
<option>-</option>
<option>*</option>
<option>/</option>
</select>
<br>
<input type="submit" onclik="return checkNum()" value="计算">
</form>
实训三——项目3.jsp
<%
//获取提交的数据,和servlet一样
String num1=request.getParameter("num1");
String num2=request.getParameter("num2");
String op=request.getParameter("op");
//定义数据变量类型,防止数据溢出
double res=0;
int flag=1;
//是把括号里面内容变成double类型的。
//如果要变成int,则用Integer.parseInt()
double a=Double.parseDouble(num1);
double b=Double.parseDouble(num2);
/*
java中equals以及==的用法(简单介绍)
简单介绍
equals方法是java.lang.Object类的方法
有两种用法说明:
一、对于字符串变量来说,使用“==”和“equals()”方法比较字符串时,其比较方法不同。
1、“==”比较两个变量本身的值,即两个对象在内存中的首地址。
(java中,对象的首地址是它在内存中存放的起始地址,它后面的地址是用来存放它所包含的各个属性的地址,
所以内存中会用多个内存块来存放对象的各个参数,而通过这个首地址就可以找到该对象,进而可以找到该对象的各个属性)
2、“equals()”比较字符串中所包含的内容是否相同。
*/
if(op.equals("+"))
res=a+b;
else
if(op.equals("-"))
res=a-b;
else
if(op.equals("*"))
res=a*b;
else
if(op.equals("/"))
{
if(b!=0)
res=a/b;
else
{
out.println("分母不能为0!");
flag=0;
}
}
if(flag!=0)
out.println("="+res);
%>
效果图:
加法:
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FELK4izm-1632815764027)(https://i.loli.net/2021/09/28/s9LcF1g2bO8vprj.png)]
减法:
乘法:
除法:
分母为0的情况:
分母不为0的情况: