JSP实现简单网页计算器

发表于JSP编程版块教程

实现一个简单的网页计算器，你可以使用JSP页面结合HTML和JavaScript。下面是一个基本的实现示例：步骤1：创建JSP页面创建一个名为 calculator.jsp 的JSP文件，内容如下：&

实现一个简单的网页计算器，你可以使用JSP页面结合HTML和JavaScript。下面是一个基本的实现示例：

步骤1：创建JSP页面

创建一个名为 calculator.jsp 的JSP文件，内容如下：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Simple Calculator</title>
</head>
<body>
    <h2>Simple Calculator</h2>
    <form action="CalculateServlet" method="post">
        <input type="text" name="number1" placeholder="Enter first number" required>
        <select name="operator">
            <option value="+">+</option>
            <option value="-">-</option>
            <option value="*">*</option>
            <option value="/">/</option>
        </select>
        <input type="text" name="number2" placeholder="Enter second number" required>
        <input type="submit" value="Calculate">
    </form>
</body>
</html>

步骤2：创建Servlet处理计算逻辑

创建一个名为 CalculateServlet 的Servlet，用于处理表单提交并执行计算。

import javax.servlet.*;
import javax.servlet.http.*;
import java.io.IOException;

public class CalculateServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 从表单获取操作数和操作符
        double number1 = Double.parseDouble(request.getParameter("number1"));
        String operator = request.getParameter("operator");
        double number2 = Double.parseDouble(request.getParameter("number2"));
        
        // 根据操作符执行计算
        double result = 0.0;
        switch (operator) {
            case "+":
                result = number1 + number2;
                break;
            case "-":
                result = number1 - number2;
                break;
            case "*":
                result = number1 * number2;
                break;
            case "/":
                if (number2 != 0) {
                    result = number1 / number2;
                } else {
                    result = Double.POSITIVE_INFINITY;
                }
                break;
            default:
                result = Double.NaN; // Not a Number
        }
        
        // 将结果存入request的属性中，以便JSP页面可以访问
        request.setAttribute("result", result);
        
        // 转发到同一个JSP页面显示结果
        request.getRequestDispatcher("calculator.jsp").forward(request, response);
    }
}

步骤3：在JSP页面中显示计算结果

修改 calculator.jsp 页面，添加一个用于显示结果的部分：

<!-- 在form标签下方添加 -->
<%-- 检查是否有计算结果 --%>
<c:if test="${not empty result}">
    <p style="font-size: 24px;">${result}</p>
</c:if>

确保你已经在项目中引入了JSTL，以便使用 <c:if> 标签。如果没有，你需要在 web.xml 中添加JSTL的配置或直接将JSTL的jar包添加到项目的lib目录下。

步骤4：配置Servlet

在 web.xml 中配置 CalculateServlet：

<servlet>
    <servlet-name>CalculateServlet</servlet-name>
    <servlet-class>CalculateServlet</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>CalculateServlet</servlet-name>
    <url-pattern>/calculate</url-pattern>
</servlet-mapping>