基于Servlet+jsp的web计算器

这次老大为了让我们自己复习web中页面的跳转给布置得任务

天下代码一大抄,关键看你怎么抄

首先我想到的计算算法不是什么堆栈,是简单的(其实很复杂,但是我就只需要知道有这个东西,东西别人做好了...传说中的CV大法好?Emmm,当你知道有这么个算法但是不会自己写可是自己会用的时候,也就相当于...自己会了.....)

废话不多说一下是收集的正则工具类,支持括号运算

package pers.cal.util;

import java.util.regex.Matcher;
import java.util.regex.Pattern; public class UtilArithmetic {
// public static void main(String[] args) {
// String src = "(3 + (5 - 2) * 10 / 2 * 3 + 15) * (8 - 4)";
// System.out.println(cal(src));
// }
public static String cal(String src) {
StringBuilder builder = new StringBuilder();
if (src.contains("(")) {
Pattern pattern = Pattern.compile("\\(([^()]+)\\)");
Matcher matcher = pattern.matcher(src);
int lastEnd = 0;
while (matcher.find()) { builder.append(src.substring(lastEnd, matcher.start()));
System.out.println(builder.toString());
builder.append(cal(matcher.group(1)));
lastEnd = matcher.end();
}
builder.append(src.substring(lastEnd));
} else {
Pattern pattern = Pattern.compile("([\\d.]+)\\s*([*/])\\s*([\\d.]+)");
builder.append(src);
Matcher matcher = pattern.matcher(builder.toString());
while (matcher.find()){
float f1 = Float.parseFloat(matcher.group(1));
float f2 = Float.parseFloat(matcher.group(3));
float result = 0;
switch (matcher.group(2)){
case "*":
result = f1 * f2;
break;
case "/":
result = f1 / f2;
break;
}
builder.replace(matcher.start(), matcher.end(),
String.valueOf(result));
matcher.reset(builder.toString());
}
pattern = Pattern.compile("([\\d.]+)\\s*([+-])\\s*([\\d.]+)");
matcher = pattern.matcher(builder.toString());
while (matcher.find()){
float f1 = Float.parseFloat(matcher.group(1));
float f2 = Float.parseFloat(matcher.group(3));
float result = 0;
switch (matcher.group(2)){
case "+":
result = f1 + f2;
break;
case "-":
result = f1 - f2;
break;
}
builder.replace(matcher.start(), matcher.end(),
String.valueOf(result));
matcher.reset(builder.toString());
}
return builder.toString();
}
System.out.println(builder);
return cal(builder.toString());
}
}

调用的时候直接用cal(String str)就好

然后是对应的前台jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!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=UTF-8">
<title>基于Servlet+jsp的Web计算器的项目</title> <link href="./css/index.css" rel="stylesheet" type="text/css" /> <script type="text/javascript">
var cleartext = false;//设置标识值
function getNum(num) {
//alert(num);
var result = document.getElementById("result");
if (cleartext) {
result.value = "";
//cleartext = false;
}
result.value += num;
} function getResult() {
var result = document.getElementById("result");
//result.value=result.value+"="+eval(result.value);
//next is the str we need
result.value = result.value;
//this result.value is the str we need
//alert(result.value);
//cleartext = true;//计算结果后改变标识
}
</script>
</head>
<body>
<div class="calculator">
<span class="copyRight">金 聖 聰 ®</span> <form action="calculator.do" method="post" name="From"
onclick="return getResult"> <div class="calculator-display">
<input type="text" name="result" id="result" size="33"
readonly=readonly value="${ count}" >
</div> <div class="calculator-keys">
<button type="button" class="all-clear" value="all-clear"
onclick="document.getElementById('result').value=''">AC</button> <button type="button" value="9" onclick="getNum('(')">(</button>
<button type="button" value="9" onclick="getNum(')')">)</button>
<button type="button" class="operator" value="+"
onclick="getNum('+')">+</button> <button type="button" value="7" onclick="getNum(7)">7</button>
<button type="button" value="8" onclick="getNum(8)">8</button>
<button type="button" value="9" onclick="getNum(9)">9</button> <button type="button" class="operator" value="-"
onclick="getNum('-')">-</button>
<button type="button" value="4" onclick="getNum(4)">4</button>
<button type="button" value="5" onclick="getNum(5)">5</button>
<button type="button" value="6" onclick="getNum(6)">6</button>
<button type="button" class="operator" value="*"
onclick="getNum('*')">&times;</button> <button type="button" value="1" onclick="getNum(1)">1</button>
<button type="button" value="2" onclick="getNum(2)">2</button>
<button type="button" value="3" onclick="getNum(3)">3</button> <button type="button" class="operator" value="/"
onclick="getNum('/')">&divide;</button>
<button type="button" value="0" onclick="getNum(0)">0</button>
<button type="button" class="decimal" value="."
onclick="getNum('.')">.</button>
<button class="equal-sign" value="=" onclick="getResult('.')">=</button>
</div> </form>
</div> </body>
</html>

他的css

html {
font-size: 62.5%;
box-sizing: border-box;
margin: 0;
padding: 0;
box-sizing: inherit
} body {
width: 100vw;
min-height: 100vh;
background-color: #B0C4DE;
display: flex;
justify-content: center;
align-items: center;
} .calculator {
background: #1d1e22;
padding:2.8rem .64rem .64rem;
color: white;
border-radius: .5rem;
box-shadow: 0 .3rem 3rem .1rem rgba(0,0,0,0.6);
position: relative;
min-width: 40rem;
} .calculator-display {
font-size: 5rem;
height: 80px;
padding: 0 20px;
background-color: #1d1e22;
color: #fff;
display: flex;
align-items: center;
justify-content: flex-end; }
#result{
color:white;
background-color:#003300;
width:100%;
height:50%;
font-size:33%;
text-align:right;
}
button {
height: 60px;
border-radius: 3px;
border: 1px solid #c4c4c4;
font-size: 2rem;
background-color: #fff; } .calculator-keys {
display: grid;
grid-gap: 2rem;
padding: 2rem 1.36rem;
background-color: #fff;
} .equal-sign {
grid-row: 5 / span 1;
grid-column: 3 / 5;
height: 100%;
}
.copyRight{
text-align: center;
display:block;
color:black;
font-weight:bolder;
font-size: 33px;
}

长这个样子

用到了El表达式

相关jar包

xml配置

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
id="WebApp_ID" version="2.5">
<display-name>Calculation</display-name> <servlet>
<servlet-name>ServletDemo</servlet-name>
<servlet-class>pers.cal.servlet.CalculationServlet</servlet-class>
</servlet> <servlet-mapping>
<servlet-name>ServletDemo</servlet-name>
<url-pattern>/calculator.do</url-pattern>
</servlet-mapping>
</web-app>

对应的Servlet

package pers.cal.servlet;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession; import pers.cal.util.UtilArithmetic; public class CalculationServlet extends HttpServlet {
/**
*
*/
private static final long serialVersionUID = 1L; @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doPost(req, resp);
} @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { String result = req.getParameter("result");
// req.setAttribute("result", "admin");
String finalRes = result;
result = finalRes+"="+UtilArithmetic.cal(result); HttpSession session = req.getSession();
session.setAttribute("count",result);
System.out.println(result);
req.getRequestDispatcher("index.jsp").forward(req, resp);
} }

最后是结构

晚安。

做个好梦

おやすみ~

基于Servlet+jsp的web计算器的更多相关文章

  1. 基于servlet实现一个web框架

    servlet作为一个web规范.其本身就算做一个web开发框架,可是其web action (响应某个URI的实现)的实现都是基于类的,不是非常方便,而且3.0之前的版本号还必须通过web.xml配 ...

  2. javaweb学习总结(二十二)——基于Servlet+JSP+JavaBean开发模式的用户登录注册

    一.Servlet+JSP+JavaBean开发模式(MVC)介绍 Servlet+JSP+JavaBean模式(MVC)适合开发复杂的web应用,在这种模式下,servlet负责处理用户请求,jsp ...

  3. JavaWeb学习 (二十一)————基于Servlet+JSP+JavaBean开发模式的用户登录注册

    一.Servlet+JSP+JavaBean开发模式(MVC)介绍 Servlet+JSP+JavaBean模式(MVC)适合开发复杂的web应用,在这种模式下,servlet负责处理用户请求,jsp ...

  4. 基于Servlet+JSP+JavaBean开发模式的用户登录注册

    http://www.cnblogs.com/xdp-gacl/p/3902537.html 一.Servlet+JSP+JavaBean开发模式(MVC)介绍 Servlet+JSP+JavaBea ...

  5. javaweb(二十二)——基于Servlet+JSP+JavaBean开发模式的用户登录注册

    一.Servlet+JSP+JavaBean开发模式(MVC)介绍 Servlet+JSP+JavaBean模式(MVC)适合开发复杂的web应用,在这种模式下,servlet负责处理用户请求,jsp ...

  6. JavaWeb实现用户登录注册功能实例代码(基于Servlet+JSP+JavaBean模式)

    一.Servlet+JSP+JavaBean开发模式(MVC)介绍 Servlet+JSP+JavaBean模式(MVC)适合开发复杂的web应用,在这种模式下,servlet负责处理用户请求,jsp ...

  7. [ Servlet / JSP ] J2EE Web Application 中的 JSESSIONID 是什么?

    JSESSIONID is a cookie in J2EE web application which is used in session tracking. Since HTTP is a st ...

  8. 《Head First Servlet JSP》web服务器,容器,servlet的职责

    (一)web服务器,容器,servlet的职责 (二)J2EE服务器与web容器

  9. Servlet & JSP - Java Web 访问资源的路径问题

    假设 Web 工程的目录结构如下图所示,并且 HelloServlet 配置为 @WebServlet(name = "helloServlet", urlPatterns = { ...

随机推荐

  1. 爬虫之ssh证书警告错误

    错误信息: 错误信息如下: requests.exceptions.SSLError: ("bad handshake: Error([('SSL routines', 'tls_proce ...

  2. Java开源生鲜电商平台-购物车模块的设计与架构(源码可下载)

    ava开源生鲜电商平台-购物车模块的设计与架构(源码可下载) 说明:任何一个电商无论是B2C还是B2B都有一个购物车模块,其中最重要的原因就是客户需要的东西放在一起,形成一个购物清单,确认是否有问题, ...

  3. PAT1031:Hello World for U

    1031. Hello World for U (20) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Giv ...

  4. capwap学习笔记——初识capwap(四)(转)

    2.5.7 CAPWAP传输机制 WTP和AC之间使用标准的UDP客户端/服务器模式来建立通讯. CAPWAP协议支持UDP和UDP-Lite [RFC3828]. ¢ 在IPv4上,CAPWAP控制 ...

  5. Java公开课-02.抽象类和接口

    在讲述抽象类和接口之前,扯点别的:封装,继承,多态,我只做个简单的涉略 一,封装 1.体现: 将变量和方法放到一个类中 私有字段封装成共有属性 2.this: 如果发现成员变量的名称和方法参数的名称相 ...

  6. 玩转web之ligerui(二)---前缀编码生成树(分级码)实现树型表格

    请珍惜小编劳动成果,该文章为小编原创,转载请注明出处. 背景:             在ligerui中(其他uI可能也大同小异),实现树形表格可以通过父子节点,也可以通过前缀编码生成树去实现,而使 ...

  7. python之@property

    在绑定属性时,如果我们直接把属性暴露出去,虽然写起来很简单,但是,没办法检查参数,导致可以把成绩随便改: s = Student() s.score = 9999 这显然不合逻辑.为了限制score的 ...

  8. BZOJ_2529_[Poi2011]Sticks_贪心

    BZOJ_2529_[Poi2011]Sticks_贪心 Description Little Johnny was given a birthday present by his grandpare ...

  9. angular开发环境配置全套教程

    第一步.安装node.js 1.需要下载的文件路径:https://nodejs.org/en/download/ 2.安装nodejs: 3.验证node.js 4.npm安装以及验证: npm的安 ...

  10. Windows上安装配置SSH教程(5)——win10下使用Cygwin+Expect自动登陆ssh

    1.安装Cygwin,安装上Tcl和Expect两个工具. 可以使用apt-cyg命令安装,也可以在安装Cygwin的时候选中这两个包. 命令安装的话使用下面的两个命令: apt-cyg instal ...