使用Spring Boot搭建后端,通过CalculatorController处理加减乘除运算并返回JSON结果;2. 前端用HTML+JavaScript实现用户界面,通过fetch调用/calculate接口;3. 输入验证与错误提示完整,支持除零检测;4. 项目结构清晰,运行在8080端口,便于学习Java Web基础。

在Java中开发一个简单的在线计算器,可以通过结合后端处理逻辑和前端页面实现。这里使用Java的Spring Boot框架快速搭建Web服务,配合HTML+JavaScript完成一个基础的网页计算器。
1. 创建Spring Boot项目
使用Spring Initializr创建一个新项目,选择以下依赖:
- Spring Web:用于构建Web接口
项目结构示例:
src/├── main/
│ ├── java/
│ │ └── com.example.calculator/
│ │ ├── CalculatorApplication.java
│ │ └── CalculatorController.java
│ └── resources/
│ └── static/
│ └── index.html
2. 编写后端计算接口
创建一个控制器来处理计算请求:
立即学习“Java免费学习笔记(深入)”;
BJXSHOP购物管理系统是一个功能完善、展示信息丰富的电子商店销售平台;针对企业与个人的网上销售系统;开放式远程商店管理;完善的订单管理、销售统计、结算系统;强力搜索引擎支持;提供网上多种在线支付方式解决方案;强大的技术应用能力和网络安全系统 BJXSHOP网上购物系统 - 书店版,它具备其他通用购物系统不同的功能,有针对图书销售而进行开发的一个电子商店销售平台,如图书ISBN,图书目录
public class CalculatorController {
@GetMapping("/calculate")
public Map
@RequestParam double a,
@RequestParam double b,
@RequestParam String op) {
double result = 0;
boolean success = true;
String message = "OK";
switch (op) {
case "+": result = a + b; break;
case "-": result = a - b; break;
case "*": result = a * b; break;
case "/":
if (b == 0) {
success = false;
message = "除数不能为零";
} else {
result = a / b;
}
break;
default:
success = false;
message = "不支持的操作符";
}
Map
response.put("success", success);
response.put("result", result);
response.put("message", message);
return response;
}
}
3. 创建前端页面(HTML + JavaScript)
在 resources/static/index.html 中添加以下代码:
简单在线计算器
4. 启动并测试
运行主类启动应用,默认监听8080端口。访问 http://localhost:8080 即可看到计算器页面,输入数值后点击“计算”即可调用后端接口返回结果。
基本上就这些。这个例子展示了前后端分离的基本结构,适合学习Java Web开发入门。后续可以扩展表达式解析、历史记录、更复杂的UI等功能。









