jstl标签实现网页版简易计算器
页面效果：
## 要求
1.利用struct框架和自定义函数实现网页版计算器；
2.在jsp页面不能出现任何原生java代码；
3.通过标签直接调用方法；
4.计算器的加、减、乘、除…这些运算放在页面进行,而不是通过业务层前端控制器进行；
## 具体实现
-
写一个类：其中包括加、减、乘、除这些运算方法(由类调用，public static修饰)
-
需要一个标签描述文件（.tld文件），放在项目结构下的WEB-INF或者WEB-INF的任意子目录下；
-
提供一个表单，用于输入计算的值和选择运算符
-
写一个类继承Action，用于从表单bean中取得数据，以及告诉struts跳转到相应的jsp页面
-
提供相应的跳转页面，用自定义标签进行页面运算
-
配置相应的struts-config.xml文件
-
提供一个除0异常，跳转的jsp文件
代码
1.提供具体运算方法的类CalculatorFunction.java
package com.cn.servlet;
/***
* 用于提供实现具体操作的类
*/
public class CalculatorFunction {
//实现 +
public static String Cal_add(String value1,String value2) {
double num1=Double.parseDouble(value1);
double num2=Double.parseDouble(value2);
double result=num1+num2;
return result+"";
}
//实现 -
public static String Cal_sub(String value1,String value2) {
double num1=Double.parseDouble(value1);
double num2=Double.parseDouble(value2);
double result=num1-num2;
return result+"";
}
//实现 *
public static String Cal_mul(String value1,String value2) {
double num1=Double.parseDouble(value1);
double num2=Double.parseDouble(value2);
double result=num1*num2;
return result+"";
}
//实现 /
public static String Cal_mod(String value1,String value2) {
double num1=Double.parseDouble(value1);
double num2=Double.parseDouble(value2);
double result=num1/num2;
return result+"";
}
}
2.标签描述文件（myfunctions.tld）
<?xml version="1.0" encoding="UTF-8" ?>
<taglib xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-jsptaglibrary_2_0.xsd"
version="2.0">
<description>my functions library</description>
<display-name>my functions</display-name>
<tlib-version>1.0</tlib-version>
<!-- 注意此处的<short-name>和<uri>,在引入自定义函数库时会用到 -->
<short-name>num</short-name>
<uri>http://com.cn/myFunctions</uri>
<function>
<name>myAdd</name>
<function-class>com.cn.servlet.CalculatorFunction</function-class>
<function-signature>java.lang.String Cal_add(java.lang.String ,java.lang.String )</function-signature>
</function>
<function>
<name>mySub</name>
<function-class>com.cn.servlet.CalculatorFunction</function-class>
<function-signature>java.lang.String Cal_sub(java.lang.String ,java.lang.String )</function-signature>
</function>
<function>
<name>myMul</name>
<function-class>com.cn.servlet.CalculatorFunction</function-class>
<function-signature>java.lang.String Cal_mul(java.lang.String ,java.lang.String )</function-signature>
</function>
<function>
<name>myMod</name>
<function-class>com.cn.servlet.CalculatorFunction</function-class>
<function-signature>java.lang.String Cal_mod(java.lang.String ,java.lang.String )</function-signature>
</function>
</taglib>
3.提供一个表单，用于输入计算的值和选择运算符:calculatorForm.jsp
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>网页版简易计算器</title>
<script language="javascript">
//对文本框中未输入值做验证
function check1(){
var num1=document.getElementByName("value1").value;
var num2=document.getElementByName("value2").value;
if(num1==""){
alert("请输入第一个数字");
document.getElementByName("value1").focus();
return false;
}
if(num2==""){
alert("请输入第二个数字");
document.getElementByName("value2").focus();
return false;
}
document.getElementByName("calForm").submit();
}
</script>
</head>
<body>
<h1>简易计算器</h1>
<form name="calForm" action="calculator.do" method="post">
<input type="text" name="value1">
//将运算符做成下拉列表
<select name="operChose">
<option value="+" selected>+</option>
<option value="-">-</option>
<option value="*">×</option>
<option value="/">÷</option>
</select>
<input type="text" name="value2">
<input type="submit" value="=" onclick="check1()">
</form>
</body>
</html>
4.写一个类继承Action，用于从表单bean中取得数据，以及告诉struts跳转到相应的jsp页面，进行运算：calAction.java
package com.cn.struts;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import com.cn.bean.calFormBean;
/***
* 业务层前端控制器
*/
public class calAction extends Action {
@Override
public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request,
HttpServletResponse response) throws Exception {
calFormBean calForm=(calFormBean)form;
String value1=String.valueOf(calForm.getValue1());
String choose=calForm.getOperChose();
String value2=String.valueOf(calForm.getValue2());
if("/".equals(choose)&& "0".equals(value2)) {
//除0异常，跳转到一个出错界面
calForm.setResult("Infinity");
return mapping.findForward("myException");
}else {
return mapping.findForward("cal_jstl");
}
}
}
5.提供相应的跳转页面，用自定义标签进行页面运算：caljstl.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!-- 引入jstl标签核心库以及自定义函数库 -->
<%@page import="com.cn.struts.calAction"%>
<%@page isELIgnored="false" %>
<%@taglib prefix="num" uri="http://com.cn/myFunctions"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>简易版网页计算器</title>
</head>
<body>
<h1>网页版简易计算器</h1>
//用jstl核心库标签，判断运算符的类型
<c:if test="${cal_Form.operChose=='+'}">
//利用el表达式和自定义函数库完成运算（El表达式中不能出现空格），其中${num:myAdd(cal_Form.value1,cal_Form.value2)} num为自定义函数库的short-name;myAdd对应myfunctions.tld文件中的<function>标签中<name>myAdd</name>，括号中的为需要计算的两个实参，通过EL表达式从表单中拿到
${cal_Form.value1}${cal_Form.operChose}${cal_Form.value2}=${num:myAdd(cal_Form.value1,cal_Form.value2)}
</c:if>
<c:if test="${cal_Form.operChose=='-'}">
${cal_Form.value1}${cal_Form.operChose}${cal_Form.value2}=${num:mySub(cal_Form.value1,cal_Form.value2)}
</c:if>
<c:if test="${cal_Form.operChose=='*'}">
${cal_Form.value1}${cal_Form.operChose}${cal_Form.value2}=${num:myMul(cal_Form.value1,cal_Form.value2)}
</c:if>
<c:if test="${cal_Form.operChose=='/'}">
${cal_Form.value1}${cal_Form.operChose}${cal_Form.value2}=${num:myMod(cal_Form.value1,cal_Form.value2)}
</c:if>
<br><br>
<a href="calculatorForm.jsp">回到计算页面3</a>
</body>
</html>
6.配置相应的struts-config.xml文件
<struts-config>
<!-- ================================================ Form Bean Definitions -->
<form-beans>
<form-bean name="calForm" type="com.cn.bean.calFormBean"/>
<form-bean name="cal_Form" type="com.cn.bean.calFormBean"/>
</form-beans>
<!-- =========================================== Action Mapping Definitions -->
<action-mappings>
<action path="/calculator"
type="com.cn.struts.calAction"
name="cal_Form"
scope="request"
validate="true">
<!-- validate="true"表示加上验证，不加也是true -->
<forward name="myException" path="/cal_error.jsp"/>
<forward name="cal_jstl" path="/caljstl.jsp"/>
</action>
</action-mappings>
</struts-config>
7.提供一个除0异常，跳转的jsp文件（但貌似程序中没有真的跳转过去，个人测试的时候是没有跳转的）
cal_error.jsp
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>计算失败显示页面</title>
</head>
<body style="font-size:25px">
${cal_Form.value1}${cal_Form.operChose}${cal_Form.value2}=${cal_Form.result}
<br><a href="calculatorForm.jsp">回到计算界面1</a>
</body>
</html>
总结：之所以在myfunctions.tld中对<function-signature>中的方法返回值类型用String，传入的实参也用String，是为了让该myfunctions.tld文件中的方法定义与CalculatorFunction.java中的方法定义一致。也是我个人在写该程序时碰到的问题，本文章仅供参考哦！
<function>
<name>myAdd</name>
<function-class>com.cn.servlet.CalculatorFunction</function-class>
<function-signature>java.lang.String Cal_add(java.lang.String ,java.lang.String )</function-signature>
</function>
附：感谢您的阅读，希望对您能有所收获呀！