JavaScript实现简单的计算器功能
本文实例为大家分享了JavaScript实现简单计算器功能的具体代码,供大家参考,具体内容如下
具体要求如下:
实现代码:
<html> <head> <meta charset='utf-8'> <title>计算器</title> <script> function myck(type){var num1 = document.getElementById('num1');var num2 = document.getElementById('num2');if(type==1){ // 计算操作 var result = parseInt(num1.value) + parseInt(num2.value); alert(result); document.getElementById('resultDiv').innerText ='最终计算结果:'+ result;}else if(type==2){ var result = parseInt(num1.value) - parseInt(num2.value); alert(result); document.getElementById('resultDiv').innerText ='最终计算结果:'+ result; } else if(type==3){ var result = parseInt(num1.value) * parseInt(num2.value); alert(result); document.getElementById('resultDiv').innerText ='最终计算结果:'+ result; } else if(type==4){if(confirm('是否正确清空?')){// 清空num1.value = '';num2.value = '';document.getElementById('resultDiv').innerText=''; } } } </script> </head> <body> <div style='margin-top: 100px;margin-left: 500px;'> <span style='font-size: 60px;'>计算器</span> </div> <div> <div style='margin-left: 490px;'>数 字1:<input type='number' placeholder='请输入数字1'> </div> </div> <div> <div style='margin-left:490px;'> 数 字2:<input type='number' placeholder='请输入数字2'> </div> </div> <div> <div class='innerDiv'><input type='button' onclick='myck(1)' value='相 加'> <input type='button' onclick='myck(2)' value='相 减'> <input type='button' onclick='myck(3)' value='相 乘'><input type='button' onclick='myck(4)' value='清 空'> </div> </div> <div id='resultDiv'> </div> </body> <style> .innerDiv{ margin-left: 420px; margin-top: 20px; } </style></html>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持好吧啦网。
相关文章:
1. Django中的DateTimeField和DateField实现2. 使用JSP实现简单的用户登录注册页面示例代码解析3. 如何理解Python中包的引入4. Python语言规范之Pylint的详细用法5. 深入分析PHP设计模式6. SpringBoot 开发提速神器 Lombok+MybatisPlus+SwaggerUI7. ASP中RecordSet Open和Connection.Execute一些区别与细节分享8. Python 使用 PyQt5 开发的关机小工具分享9. Android View实现圆形进度条10. java操作mongodb之多表联查的实现($lookup)