用jsp完成购物简易计算器

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        img{
            width: 50px;
            height: 40px;
        }
    </style>
</head>
<body>
    <table>
        <tr>
            <td><img src="img/cart.png"></td>
            <td colspan="3">购物简易计算器</td>
        </tr>
        <tr>
            <td>第一个数</td>
            <td colspan="3" ><input type="text" ></td>
        </tr>
        <tr>
            <td>第二个数</td>
            <td colspan="3"><input type="text" ></td>
        </tr>
        <tr>
            <td><button onclick="cal('+')">+</button></td>
            <td><button onclick="cal('-')">-</button></td>
            <td><button onclick="cal('*')">*</button></td>
            <td><button onclick="cal('/')">/</button></td>
        </tr>
        <tr>
            <td>计算结果</td>
            <td colspan="3"><input type="text" id="result"></td>
        </tr>
    </table>
    <script>
        function cal(type) {
            var num1 = document.getElementsByTagName('input')[0].value;
            var num2 = document.getElementsByTagName('input')[1].value;
            var result = eval(parseInt(num1) + type + parseInt(num2));
            document.getElementById('result').value = result;
        }
    </script>
</body>
</html>
相关推荐
杉氧1 分钟前
Flutter 像素级还原实战:用 CustomPaint 与 Bezier 曲线手绘精致图针
android·前端·flutter
BerrySen1783 分钟前
一个Java项目改成AI流程后,最难的部分完全变了
java·大数据·人工智能·可观测性·大模型应用开发·工程思维
程序猿秃头之路13 分钟前
DDD 系列:DTO、VO、DO、Entity 怎么区分
java·ddd·领域驱动设计
自由随风飘1 小时前
JAVA中的面向对象-3
java·开发语言
金融小白数据分析之路1 小时前
绍兴市镇街echarts 制作
前端·数据库·echarts
桐薇全肯定2 小时前
MySQL学生成绩管理系统实战操作
java·数据库·sql
Nuanyt2 小时前
SSM 学习记录 第二部分 Spring整合Mybatis&Junit AOP核心概念 Spring事务管理 SpringMVC 请求与响应 Rest风格
java·spring·junit·mybatis·restful
Slice_cy2 小时前
Mint 自研框架设计与实现:从重复开发走向配置驱动(二)
前端·后端·架构
greenbbLV2 小时前
积分兑换商城供应商挑选:避坑要点与靠谱选择解析
前端·小程序