怎么用HTML和javascript做出一个加减乘除计算器?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了怎么用HTML和javascript做出一个加减乘除计算器?相关的知识,希望对你有一定的参考价值。

正在学javascript
这是一本书上的练习
请问这个该怎么做?
能不能写一个html代码给我呢?

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script>
function jiaFun() 
var oneValue = document.getElementById('oneTxt').value;
var twoValue = document.getElementById('twoTxt').value;
document.getElementById('valueTxt').value = parseFloat(oneValue) + parseFloat(twoValue);

function jianFun() 
var oneValue = document.getElementById('oneTxt').value;
var twoValue = document.getElementById('twoTxt').value;
document.getElementById('valueTxt').value = parseFloat(oneValue) - parseFloat(twoValue);

function chengFun() 
var oneValue = document.getElementById('oneTxt').value;
var twoValue = document.getElementById('twoTxt').value;
document.getElementById('valueTxt').value = parseFloat(oneValue) * parseFloat(twoValue);

function chuFun() 
var oneValue = document.getElementById('oneTxt').value;
var twoValue = document.getElementById('twoTxt').value;
document.getElementById('valueTxt').value = parseFloat(oneValue) / parseFloat(twoValue);

</script>
</head>
<body>
第一个数:<input type="text" id="oneTxt" /><br />
第二个数:<input type="text" id="twoTxt" /><br /><br />
<input type="button" value="+" style="width:60px" onclick="jiaFun()" />
<input type="button" value="-" style="width:60px" onclick="jianFun()" />
<input type="button" value="×" style="width:60px" onclick="chengFun()" />
<input type="button" value="÷" style="width:60px" onclick="chuFun()" /><br /><br />
计算结果:<input type="text" id="valueTxt" />
</body>
</html>

自己写的哦  有问题欢迎咨询

参考技术A <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<table>
<tr>
<td><input type="button" value="add" onclick="setOp('+', 'add');"/></td>
<td><input type="button" value="miner" onclick="setOp('-', 'miner');"/></td>
<td><input type="button" value="times" onclick="setOp('*', 'times');"/></td>
<td><input type="button" value="divide" onclick="setOp('/', 'divide');"/></td>
</tr>
</table>
<table id="tb_calc" style="display:none;">
<tr>
<td> <input id="x" type="text" style="width:100px" value="" name="x" /></td>
<td> <lable id="op" name="op"></lable> </td>
<td> <input id="y" type="text" style="width:100px" value="" name="y" /> </td>
<td> <input id="opTips" type="button" value="" onclick="calc();"/> </td>
<td> <lable id="z" name="z"></lable> </td>
</tr>
</table>
<script type="application/javascript">
function setOp(op, opTips)

var tb=document.getElementById("tb_calc");
tb.style.display = "none";

document.getElementById("x").value = "";
document.getElementById("y").value = "";
document.getElementById("z").innerText = "";
document.getElementById("op").innerText = op;
document.getElementById("opTips").value = opTips;

tb.style.display = "block";

function calc()

var x = parseInt(document.getElementById("x").value);
var y = parseInt(document.getElementById("y").value);
var op = document.getElementById("op").innerText;

var z = "";
switch(op)

case '+':
z = x + y;
break;
case '-':
z = x - y;
break;
case '*': ;
z = x * y;
break;
case '/': ;
z = x / y;
break;
default:
z = '';

console.log(x, op, y, '=', z);
document.getElementById("z").innerText = z;

</script>
</body>
</html>

JS浮点数的加减乘除运算

文章来源地址:http://blog.csdn.net/lyd518/article/details/7236464   转载请注明出处,尊重作者劳动成果,谢谢!
问题这样的:   
37.5*5.5=206.08 (JS算出来是这样的一个结果,我四舍五入取两位小数)   我先怀疑是四舍五入的问题,就直接用JS算了一个结果为:206.08499999999998   怎么会这样,两个只有一位小数的数字相乘,怎么可能多出这么小数点出来。   我Google了一下,发现原来这是JavaScript浮点运算的一个bug。   比如:7*0.8 JavaScript算出来就是:5.6000000000000005   网上找到了一些解决办法,就是重新写了一些浮点运算的函数。   下面就把这些方法摘录下来,以供遇到同样问题的朋友参考:       程序代码 //除法函数,用来得到精确的除法结果 // 说明:javascript的除法结果会有误差,在两个浮点数相除的时候会比较明显。这个函数返回较为精确的除法结果。 //调用:accDiv(arg1,arg2) //返回值:arg1除以arg2的精确结果 function accDiv(arg1, arg2) { var t1 = 0, t2 = 0, r1, r2; try { t1 = arg1.toString().split(".")[1].length } catch (e) { } try { t2 = arg2.toString().split(".")[1].length } catch (e) { } with (Math) { r1 = Number(arg1.toString().replace(".", "")) r2 = Number(arg2.toString().replace(".", "")) return (r1 / r2) * pow(10, t2 - t1); } } //给Number类型增加一个div方法,调用起来更加方便。 Number.prototype.div = function(arg) { return accDiv(this, arg); } //乘法函数,用来得到精确的乘法结果 //说明:javascript的乘法结果会有误差,在两个浮点数相乘的时候会比较明显。这个函数返回较为精确的乘法结果。 //调用:accMul(arg1,arg2) //返回值:arg1乘以 arg2的精确结果 function accMul(arg1, arg2) { var m = 0, s1 = arg1.toString(), s2 = arg2.toString(); try { m += s1.split(".")[1].length } catch (e) { } try { m += s2.split(".")[1].length } catch (e) { } return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m) } // 给Number类型增加一个mul方法,调用起来更加方便。 Number.prototype.mul = function(arg) { return accMul(arg, this); } //加法函数,用来得到精确的加法结果 //说明:javascript的加法结果会有误差,在两个浮点数相加的时候会比较明显。这个函数返回较为精确的加法结果。 //调用:accAdd(arg1,arg2) // 返回值:arg1加上arg2的精确结果 function accAdd(arg1, arg2) { var r1, r2, m, c; try { r1 = arg1.toString().split(".")[1].length } catch (e) { r1 = 0 } try { r2 = arg2.toString().split(".")[1].length } catch (e) { r2 = 0 } c = Math.abs(r1 - r2); m = Math.pow(10, Math.max(r1, r2)) if (c > 0) { var cm = Math.pow(10, c); if (r1 > r2) { arg1 = Number(arg1.toString().replace(".", "")); arg2 = Number(arg2.toString().replace(".", "")) * cm; } else { arg1 = Number(arg1.toString().replace(".", "")) * cm; arg2 = Number(arg2.toString().replace(".", "")); } } else { arg1 = Number(arg1.toString().replace(".", "")); arg2 = Number(arg2.toString().replace(".", "")); } return (arg1 + arg2) / m } //给Number类型增加一个add方法,调用起来更加方便。 Number.prototype.add = function(arg) { return accAdd(arg, this); } //减法函数,用来得到精确的减法结果 //说明:javascript的减法结果会有误差,在两个浮点数相减的时候会比较明显。这个函数返回较为精确的减法结果。 //调用:accSub(arg1,arg2) // 返回值:arg1加上arg2的精确结果 function accSub(arg1,arg2){    var r1,r2,m,n;    try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}    try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}    m=Math.pow(10,Math.max(r1,r2));    //last modify by deeka    //动态控制精度长度    n=(r1>=r2)?r1:r2;    return ((arg1*m-arg2*m)/m).toFixed(n); }   在你要用的地方包含这些函数,然后调用它来计算就可以了。   比如你要计算:7*0.8 ,则改成 (7).mul(8)   其它运算类似,就可以得到比较精确的结果。

 


以上是关于怎么用HTML和javascript做出一个加减乘除计算器?的主要内容,如果未能解决你的问题,请参考以下文章

用PYTHON2做个计算器,只要加减乘除

用shell做个加减乘除运算

js浮点数的加减乘除解决方案

js 加减乘除计算的问题

html中javascript计算加减乘除,哪位大哥帮帮忙啊!

怎么在eclipse中做个简单的加减乘除的计算器,html页面如下,高手请回答,非诚勿扰