首页 > 代码库 > [java代码库]-简易计算器（第一种）
[java代码库]-简易计算器（第一种）
简易计算器（效果如图所示）
第一种方案：采用Javascript+html完成计算器，支持+-*/，结果显示不允许使用input输入域（可以考虑使用《span》）
<html> <head> <title>简易计算器</title> <script language="javascript">//易错：不是"text/javascript" function doCal(){ //alert(document.getElementByName("value1").length);//易错：getElementByName,首字母大写，不是byName //alert(document.getElementByName("value1")[0].value);//易错：getElementByName，返回一个集合，应该用[0]表示需要获得第几个元素 var value1=parseInt(document.getElementById("value1").value);//易错：易错：getElementById首字母大写，不是byId var flag=document.getElementById("flag").value; var value2=parseInt(document.getElementById("value2").value);//易错：getElementBy返回是String类型，应该通过parseInt转换为Int类型 //alert(value1+","+flag+","+value2);//多打印东西出来，用于检验 var s=0; switch(flag){ case "+"://易错：语法，别忘记加冒号 s=value1+value2; break;//易错：语法，别忘记加break；跳出选择 case "-": s=value1-value2; break; case "*": s=value1*value2; break; case "/": s=value1/value2; } //使运算结果显示在浏览器中，注意=右侧为string类型 document.getElementById("span_result").innerHTML="<font size=‘16‘ color=‘red‘>"+s+"</font>" } //alert(document.getElementByName(value1).value); </script> </head> <body> <h1>简易计算器</h1> <hr> <input type="text" name="value1" id="value1"> <select name="flag" id="flag">//注意select-option的用法 <option value="http://www.mamicode.com/+">+</option> <option value="http://www.mamicode.com/-">-</option> <option value="http://www.mamicode.com/*">*</option> <option value="http://www.mamicode.com/">/</option> </select> <input type="text" name="value2" id="value2"> <!-- <button type="button" onclick="doCal()">点击这里</button> --> <input type="button" valuehttp://www.mamicode.com/="=" onclick="doCal()">//button的onclick事件 <!-- <input type="text" name="result" id="result"> --> <span id="span_result"></span>//通过span显示结果 </body></html>
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。