fuill 2022-10-23 19:46 采纳率: 68.2%
浏览 33
已结题

服务器版算术四则运算器

使用Spring Boot+SpringMVC+(Thymeleaf可选)完成服务器版算术四则运算器,要求:

只有一个页面,有一个表单,有两个文本表单域用于输入两个操作数,一个下拉列表或单选按钮选择加减乘除运算,有一个确定或“=”按钮,点击后从服务器得到运算结果进行显示。页面样式自行设计。结果获得,同步或异步都可以。

对输入进行服务器端校验,操作数输入不能为空,必须是数字(整数或浮点数)。校验不通过返回输入页面显示错误信息。

在自定义的Controller中获取请求,进行四则运算,返回操作结果。

jsp内容有了:

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<script src="${pageContext.request.contextPath}/js/jquery-3.3.1.min.js" type="text/javascript"></script>
<html>
<head>
    <title>Title</title>
    <script language="JavaScript">
        $(function () {
            $("#btn").click(function(){
                let num1=$("#numOne").val();
                let num2=$("#numTwo").val();
                let yun=$("#yunsuan").val();
                let param='{"numOne":'+'"'+num1+'"'+',"numTwo":'+'"'+num2+'"'+',"yunSuan":'+'"'+yun+'"'+'}';
               // let array=new String();
         
                $.ajax(
                    {
                        url:"${pageContext.request.contextPath}/calculatorController/calculate",
                        contentType:"application/json;charset=utf-8",
                        data:param,
                        dataType:"Json",
                        type:"POST",
                        success:function (data) {
                            var dataObj = data.result;
                           $("#result").html("结果="+dataObj);
                           $("#test2").innerHTML="success";
                        }
                    }
                )
            })

        })

        function checkNum1(num) {
            let num1 = num.value;
            if (num1 == '') {
                alert("不能输入为空");
                return false;
            }
            if (Math.round(num1) != num1) {
                alert("这个数不是一个数字");
                num.value = '';
                num.onfocus;
                return false;
            }
            return true;
        }
    </script>
</head>
<body>
<form name="form1" action="" method="post">
    请输入第一个数:<input type="text" name="numOne" id="numOne" onblur="checkNum1(this)">
    <select name="yunSuan" id="yunsuan">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
    </select>
    请输入第二个数:<input type="text" name="numTwo" id="numTwo" onblur="checkNum1(this)">
    <input type="button" value="计算" id="btn">
    <label id="result"></label>
    <label id="test2"></label>
</form>
</body>
</html>
  • 写回答

0条回答 默认 最新

    报告相同问题?

    问题事件

    • 已结题 (查看结题原因) 10月23日
    • 修改了问题 10月23日
    • 创建了问题 10月23日

    悬赏问题

    • ¥20 测距传感器数据手册i2c
    • ¥15 RPA正常跑,cmd输入cookies跑不出来
    • ¥15 求帮我调试一下freefem代码
    • ¥15 matlab代码解决,怎么运行
    • ¥15 R语言Rstudio突然无法启动
    • ¥15 关于#matlab#的问题:提取2个图像的变量作为另外一个图像像元的移动量,计算新的位置创建新的图像并提取第二个图像的变量到新的图像
    • ¥15 改算法,照着压缩包里边,参考其他代码封装的格式 写到main函数里
    • ¥15 用windows做服务的同志有吗
    • ¥60 求一个简单的网页(标签-安全|关键词-上传)
    • ¥35 lstm时间序列共享单车预测,loss值优化,参数优化算法