用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>
相关推荐
心灵Haven3 分钟前
1_安装JDK和Hadoop
java·开发语言·hadoop
斯~内克7 分钟前
React Router 完全指南:从基础到高级实践
前端·react.js·前端框架
IT、木易7 分钟前
大白话React第八章React 深入进阶与实践拓展阶段
javascript·react.js·ecmascript
m0_748232399 分钟前
qwenvl 以及qwenvl 2 模型架构理解
android·前端·后端
web1368856587110 分钟前
PHP For 循环
android·java·php
冲!!12 分钟前
vue3中ref和reactive响应式数据、ref模板引用(组合式和选项式区别)、组件ref的使用
前端·javascript·vue.js
匹马夕阳13 分钟前
React vs Vue3深度对比与使用场景分析
前端·react.js·前端框架
一路向前的月光15 分钟前
React(11)路由demo
javascript·react.js·ecmascript
loyd325 分钟前
【数据分析】5 设计不同业务分析框架
java·网络·数据分析
m0_7482451731 分钟前
Spring Boot项目开发常见问题及解决方案(上)
java·spring boot·后端