首页 > 网站 > WEB开发 > 正文

JavaScript实现计算器功能

2024-04-27 14:20:43
字体：大 中 小
来源：转载
供稿：网友

javaScript实现计算器功能

截图 :

cal.js

Js代码收藏代码
  1. varClass={};
  2. Class.calculation=function(){
  3. varcalculation={};
  4. calculation.result=0;
  5. calculation.calculate=function(num1,num2){};
  6. calculation.getResult=function(){
  7. returnthis.result;
  8. };
  9. returncalculation;
  10. };
  11. Class.add=function(){
  12. varadd=Class.calculation();
  13. add.calculate=function(num1,num2){
  14. this.result=num1+num2;
  15. };
  16. returnadd;
  17. }
  18. Class.subtraction=function(){
  19. varsubtraction=Class.calculation();
  20. subtraction.calculate=function(num1,num2){
  21. this.result=num1-num2;
  22. };
  23. returnsubtraction;
  24. }
  25. Class.multiply=function(){
  26. varmultiply=Class.calculation();
  27. multiply.calculate=function(num1,num2){
  28. this.result=num1*num2;
  29. };
  30. returnmultiply;
  31. }
  32. Class.divide=function(){
  33. vardivide=Class.calculation();
  34. divide.calculate=function(num1,num2){
  35. this.result=num1/num2;
  36. };
  37. returndivide;
  38. }
  39. Class.calculator=function(num1,num2,op){
  40. varobj=null;
  41. varnum1=parseInt(num1)||0;
  42. varnum2=parseInt(num2)||0;
  43. if("+"==op){
  44. obj=Class.add();
  45. }
  46. elseif("-"==op){
  47. obj=Class.subtraction();
  48. }
  49. elseif("*"==op){
  50. obj=Class.multiply();
  51. }
  52. elseif("/"==op){
  53. if(0==num2){
  54. alert("除数不能为零!");
  55. return;
  56. }
  57. obj=Class.divide();
  58. }
  59. else{
  60. alert("无效的"+op+"操作符!");
  61. return;
  62. }
  63. obj.calculate(num1,num2);
  64. alert("计算结果:"+obj.getResult());
  65. }

测试 :

Html代码收藏代码
  1. <!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.0Transitional//EN">
  2. <HTML>
  3. <HEAD>
  4. <TITLE>Javascript面向对象</TITLE>
  5. <scripttype="text/javascript"src="js-lib/cal.js"></script>
  6. <scripttype="text/javascript">
  7. window.onload=function(){
  8. document.getElementById("command").onclick=function(){
  9. varn1=document.getElementById("n1").value;
  10. varOpera=document.getElementById("opera").value;
  11. varn2=document.getElementById("n2").value;
  12. Class.calculator(n1,n2,opera);
  13. }
  14. };
  15. </script>
  16. </HEAD>
  18. <BODY>
  20. 操作数1:<inputtype="text"id="n1"/></br></br>
  21. 操作符号:<inputsize="4"type="text"id="opera"/></br></br>
  22. 操作数2:<inputtype="text"id="n2"/></br></br>
  23. <inputtype="button"id="command"value="计算"/>
  24. </BODY>
  25. </HTML>

上一篇：【javascript】分享一款经典的日期控件 My97DatePicker

下一篇：基于Netty和Raphael的塔防online游戏（一）

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表
学习交流
更多

硬盘分区如何设置准确的分区空间

硬盘分区如何设置准确的分区空间...
热门图片
更多
猜你喜欢的新闻
猜你喜欢的关注

新闻热点

英伟达市值一夜大涨9246亿 创2023年5月以来最大单周涨幅
2024-04-27 13:35:46
雷军：小米正在申请3万件专利，以提升自身的竞争力
2024-04-27 13:33:47
人参泡酒15年后竟“复活”？网友：这酒还能喝不？
2024-04-24 22:53:44
芯片股普涨！英伟达市值一夜大涨6000亿元
2024-04-23 19:32:50
面馆老板1天卖100碗刚够交房租 要卖到150碗才能实现盈利
2024-04-23 19:25:50
跌近30%！茶百道上市一小时跌没3年净利润
2024-04-23 19:13:19

疑难解答

图片精选

网友关注

关于本站 - 网上投稿 - 商务合作 - 隐私政策 - 网站地图
Copyright © 2008 - 2024 VEVB.COM. All Rights Reserved.武林网 版权所有