用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>
相关推荐
TDengine (老段)3 分钟前
TDengine 中的关联查询
大数据·javascript·网络·物联网·时序数据库·tdengine·iotdb
xyliiiiiL35 分钟前
ZGC初步了解
java·jvm·算法
杉之1 小时前
常见前端GET请求以及对应的Spring后端接收接口写法
java·前端·后端·spring·vue
喝拿铁写前端1 小时前
字段聚类,到底有什么用?——从系统混乱到结构认知的第一步
前端
再学一点就睡1 小时前
大文件上传之切片上传以及开发全流程之前端篇
前端·javascript
hycccccch2 小时前
Canal+RabbitMQ实现MySQL数据增量同步
java·数据库·后端·rabbitmq
木木黄木木2 小时前
html5炫酷图片悬停效果实现详解
前端·html·html5
天天向上杰3 小时前
面基JavaEE银行金融业务逻辑层处理金融数据类型BigDecimal
java·bigdecimal
请来次降维打击!!!3 小时前
优选算法系列(5.位运算)
java·前端·c++·算法
用键盘当武器的秋刀鱼3 小时前
springBoot统一响应类型3.5.1版本
java·spring boot·后端