我们要实现页面效果： 了解过html的都知道，提交数据用的是form表单，表单中的内容是被发送出去的内容。 大部分开发都是这样的，先画ui后考虑功能，所以我们先用代码表示出这个界
我们要实现页面效果：
了解过html的都知道，提交数据用的是form表单，表单中的内容是被发送出去的内容。
大部分开发都是这样的，先画ui后考虑功能，所以我们先用代码表示出这个界面：
<form action="" method="get"> <h1>加法计算</h1> <!-- h1表示标题大小级数，还有h2,h3....数字越大则标题字大小越小 --> 操作数1<input name="num1"><br> <!-- name值的作用是用来根据名字取参数的，相当于“键值对” --> 操作数2<input name="num2"><br> <input type="submit" value="计算"> </form>
然后我们考虑我们的逻辑代码：
<%
int a=Integer.parseInt(request.getParameter("num1"));
int b=Integer.parseInt(request.getParameter("num2"));
out.print(a+b);
%>
解释一下，因为在jsp中，request属于9个内置函数中的一员，所以不用实例化（即不用创建对象），这是属于jsp的内置对象，所以进行纯java开发的时候不能这么写。
运行，噫！报错了？
我们观看出错信息（红色划线处）可以知道：变量被赋予了null值 （ 这是新手最最最最容易犯的错 ）
原来是因为 jsp 刚运行的时候，输入框内都是没有值的，所以这时候直接输出a+b就会输出null+null。
为了解决这个错误，我们必须设置 if 语句判断值是否为空，所以完整代码如下：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<!-- 表单内的内容是被发送出去的内容,action表示提交给谁，不写就默认提交给自己。method是提交信息的方式:get,post -->
<!-- get是明码提交 ，post则暗中操作-->
<!-- 下面是ui界面代码 -->
<form action="" method="get">
<h1>加法计算</h1> <!-- h1表示标题大小级数，还有h2,h3....数字越大则标题字大小越小 -->
操作数1<input name="num1"><br>
操作数2<input name="num2"><br>
<input type="submit" value="计算">
</form>
<%
//这个是逻辑代码
String num1=request.getParameter("num1");
String num2=request.getParameter("num2");
if(num1!=null&&num2!=null){
int a=Integer.parseInt(num1);
int b=Integer.parseInt(num2);
out.print(a+b); //虽然out.print(a+b)和<%=a+b>等效，但是写在这里面是错误的，因为表达式是相互独立的，不能互相嵌套
//和System.out.print(a+b);也等效啦，但是一个是显示在页面的，一个是显示在控制台中的
}
%>
</body>
</html>
还有另一种实现方式，通过按钮的点击事件：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<form action="" method="get" name="abadd"> <!-- 这一行有所修改，新增了特定name值 -->
<h1>加法计算</h1>
操作数1<input name="num1"><br>
操作数2<input name="num2"><br>
<input type="button" value="计算" onclick="add()" > <!-- 这一行有所修改：表示当点击按钮时触发add()事件 -->
</form>
<!-- 新增下面的 -->
<script language="javascript">
function add(){
document.abadd.submit(); //表示触发了名为abadd的表单的数据提交
}
</script>
<%
String num1=request.getParameter("num1");
String num2=request.getParameter("num2");
if(num1!=null&&num2!=null){
int a=Integer.parseInt(num1);
int b=Integer.parseInt(num2);
out.print(a+b);
}
%>
</body>
</html>举一反三，我们可以融合一些以前学过的html的知识加强我们的页面：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<form action="" method="get" name="abadd"><!-- 表单内的内容是被发送出去的内容,action表示提交给谁，不写就默认提交给自己，method是提交方式 -->
<h1>加法计算</h1>
操作数1<input type="text" name="num1"><br>
操作数2<input type="text" name="num2"><br>
<input type="radio" name="op" value="1">加法 <br><!-- 加法和减法的name都相同是为了保证它们都是同一组选择按钮，而不是单独的可选按钮 -->
<input type="radio" name="op" value="2">减法<br> <!-- 正因为name是相同的，所以同组的通过value来获取实例 -->
<input type="submit" value="计算" onclick="add()" >
</form>
<%
int a=0,b=0; //局部变量要记得赋初值
String str1=request.getParameter("num1");
String str2=request.getParameter("num2");
String op_value=request.getParameter("op");
if(str1!=null&&str2!=null){
a=Integer.parseInt(str1);
b=Integer.parseInt(str2);
}
if(op_value!=null)
switch(op_value){
case "1":
out.print(a+b);
break;
case "2":
out.print(a-b);
break;
default:
out.print("异常");
break;
}
%>
</body>
</html>