用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>
相关推荐
老虎06272 分钟前
JavaWeb前端(HTML,CSS具体案例)
前端·css·html
MacroZheng5 分钟前
还在用WebSocket实现即时通讯?试试MQTT吧,真香!
java·spring boot·后端
Mintopia8 分钟前
一个月速成 AI 工程师:从代码小白到智能工匠的修炼手册
前端·javascript·aigc
Mintopia11 分钟前
Next.js 全栈:接收和处理请求
前端·javascript·next.js
稚辉君.MCA_P8_Java19 分钟前
豆包 Java的23种设计模式
java·linux·jvm·设计模式·kubernetes
tanyongxi6620 分钟前
C++ 特殊类设计与单例模式解析
java·开发语言·数据结构·c++·算法·单例模式
遗憾皆是温柔22 分钟前
24. 什么是不可变对象,好处是什么
java·开发语言·面试·学习方法
midsummer_woo28 分钟前
基于springboot的IT技术交流和分享平台的设计与实现(源码+论文)
java·spring boot·后端
Peter(阿斯拉)39 分钟前
[Java性能优化]_[时间优化]_[字符串拼接的多种方法性能分析]
java·性能优化·stringbuilder·string·字符串拼接·stringbuffer·时间优化