day10_初学jsp

最新推荐文章于 2024-09-22 11:17:00 发布

Reven_凯

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量547

点赞数

文章标签： jsp javascript html

本文链接：https://blog.csdn.net/u014420383/article/details/24589653

版权

servlet以大量java代码+少量html标签语言的方式实现网页应用的制作，但并不是非常适合对页面部分的制作，相比JSP来讲，servlet更适合进行网页后台管理。

JSP和servlet不同，其代码以大量html标签语言+少量java代码+一部分javascript的形式组合而成。JSP应对页面部分+servlet应对后台部分，实现了网页应用的最佳搭配。

笔者初学jsp，了解了jsp的运行原理，即初次运行时，自己编写的.jsp文件会在服务器端自动生成相应的servlet（.java）文件，并保存在内存中，如果用的是tomcat虚拟服务器，.java文件就是在C:\tomcat\apache-tomcat-7.0.52\work\Catalina\localhost\RevenJspSite\org\apache\jsp目录下，下次再次访问时会直接调用内存中的内容，效率更快。

相应的程序为一个简单的网页计算器

该计算器分为两个.jsp文件，一个用来进行输入数据(myCal.jsp)，一个用来进行计算数据得到结果(myResult.jsp)

myCal.jsp：

<!-- 这是计算器的界面 -->
<%@page contentType="text/html;charset=gb2312" %>
<html>
<h1>我的计算器</h1>
<body>
<hr>
<!-- 在jsp中添加js代码,防止用户空提交 -->
<script language="javascript">
	<!--
	//写一个函数验证用户是不是空提交
		function checkNum()
		{
			//判断，num是不是空的
			
			if(form1.num1.value == ""||form1.num2.value == "")
			{
				window.alert("请填入数值再进行运算!");
				return false;
			}
		
		
			if(Math.round(form1.num1.value)!=form1.num1.value||Math.round(form1.num2.value)!=form1.num2.value)
			{
				window.alert("请填入有效数值再进行运算!");
				return false;
			}
		
		}
	 -->
		 	
	 
</script>
<form name="form1" action="myResult.jsp">
请输入第一个数:<input type="text" name="num1">
<select name="flag">
<option value=+>+</option>
<option value=->-</option>
<option value=*>*</option>
<option value=/>/</option>
</select>
请输入第二个数:<input type="text" name="num2">
<input type="submit" value="计算结果" οnclick="return checkNum();">
<hr>
</form>
</body>
</html>

myResult.jsp：

<!-- 得到数据并计算，还要显示出来 -->
<%@page contentType="text/html;charset=gb2312" %>
<html>
<body>
<% 
			//接受到第一个数
			String s_num1 = request.getParameter("num1");
			//接受第二个数
			String s_num2 = request.getParameter("num2");
			//接受运算符号
			String flag = request.getParameter("flag");
			//计算
			int num1 = 0;
			int num2 = 0;
			int result = 0;
			//java中String->int
			num1 = Integer.parseInt(s_num1);
			num2 = Integer.parseInt(s_num2);
			
			if(flag.equals("+"))
				result = num1+num2;
			else if(flag.equals("-"))
				result = num1-num2;
			else if(flag.equals("*"))
				result = num1*num2;
			else if(flag.equals("/"))
				result = num1/num2;
			
			//输出结果
			out.println("计算结果为"+result);
			
			
			

 %>
</body>
</html>

可以看到myCal.jsp文件中并不是简单地实现接受数据，其中包括了对输入数据的判断（输入值是否为空，输入值是否为数值类型），该段通过插入javaScript代码实现，用户使用结果为弹出一个window.alert+警告语句，还包括了HTML的form表单的运用，用来将填入的数据传入myResult进行结果计算。

效果图如下