基于Servlet+jsp的web计算器
程序员文章站
2022-10-01 12:23:16
基于Servlet+jsp的web计算器 这次老大为了让我们自己复习web中页面的跳转给不值得任务 天下代码一大抄,关键看你怎么抄 首先我想到的计算算法不是什么堆栈,是简单的(其实很复杂,但是我就只需要知道有这个东西,东西别人做好了...传说中的CV大法好?Emmm,当你知道有这么个算法但是不会自己 ......
基于servlet+jsp的web计算器
这次老大为了让我们自己复习web中页面的跳转给不值得任务
天下代码一大抄,关键看你怎么抄
首先我想到的计算算法不是什么堆栈,是简单的(其实很复杂,但是我就只需要知道有这个东西,东西别人做好了...传说中的cv大法好?emmm,当你知道有这么个算法但是不会自己写可是自己会用的时候,也就相当于...自己会了.....)
废话不多说一下是收集的正则工具类,支持括号运算
package pers.cal.util; import java.util.regex.matcher; import java.util.regex.pattern; /** * 正则表达式实现的计算器带括号版本 * @author administrator * */ public class utilarithmetic { /** * 计算可能含有括号的表达式 * * @param s * @return */ public static string calcu(string s) { s = s.replaceall(" +", "");// 消除空格,空格可以是一个或多个,找到就替换 // \\(为左括号 \\)右括号,表示在括号内没有其他括号,然后用括号括起来是一个子组e pattern pa = pattern.compile("\\(([^\\(\\)]*)\\)"); while (true) { matcher ma = pa.matcher(s); if (ma.find() == false) break; // 先计算括号内,然后消除括号 s = s.replace(ma.group(), calcunoparen(ma.group(1))); } return calcunoparen(s); } /** * 计算没有括号的运算 * * @param s2 * @return */ public static string calcunoparen(string s2) { if (s2.length() < 1) return s2; // 先把乘法消除 pattern pat = pattern.compile("([0-9]+)\\*([0-9]+)");//0-9一个或多个,乘法 while (true) { matcher mc = pat.matcher(s2); if (mc.find() == false) break; int res = integer.parseint(mc.group(1)) * integer.parseint(mc.group(2)); // 计算出结果,并且消除括号,注意这里不能用replaceall s2 = s2.replace(mc.group(), res + ""); } // 再从左到右消除所有加法和减法 pat = pattern.compile("([0-9]+)([\\+\\-])([0-9]+)");// 0-9一个或多个,加法或者减法 while (true) { matcher mc = pat.matcher(s2); if (mc.find() == false) break; int res = 0; switch (mc.group(2)) { case "+": res = integer.parseint(mc.group(1)) + integer.parseint(mc.group(3)); break; case "-": res = integer.parseint(mc.group(1)) - integer.parseint(mc.group(3)); break; } // 计算出结果,并且消除括号,注意这里不能用replaceal s2 = s2.replace(mc.group(), res + ""); } return s2; } }
调用的时候直接用calcu()
就好
然后是对应的前台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('*')">×</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('/')">÷</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.calcu(result); httpsession session = req.getsession(); session.setattribute("count",result); system.out.println(result); req.getrequestdispatcher("index.jsp").forward(req, resp); } }
最后是结构
晚安。
做个好梦
おやすみ~
推荐阅读
-
Python3.6基于正则实现的计算器示例【无优化简单注释版】
-
Python基于twisted实现简单的web服务器
-
基于wxpython开发的简单gui计算器实例
-
基于wsgiref的web框架
-
JAVA WEB快速入门之从编写一个基于SpringBoot+Mybatis快速创建的REST API项目了解SpringBoot、SpringMVC REST API、Mybatis等相关知识
-
Annyong 基于ruby的将本地目录变身 Web 服务器
-
JAVA WEB快速入门之从编写一个基于SpringMVC框架的网站了解Maven、SpringMVC、SpringJDBC
-
显示页面show.asp--基于web的QQ程序1
-
接收信息页面inform.asp--基于web的QQ程序2
-
发送信息页面send.asp--基于web的QQ程序3