Question

我正在尝试使用文本输入值作为数字创建一个Web计算器，并用结果替换底部的标签。虽然我面临的问题是函数要么没有被调用，要么被其他东西调用。我刚开始使用Javascript，如果你们指出问题，我会非常感激。

<!DOCTYPE html>
<html>
<head>
<title>Calc+</title>
<link rel="stylesheet" href="calculator.css">
</head>
<body>


<header>
<div class="container"><center><p><strong>Tarun's</strong>|Calculator</p>
</center></div> 
</header>
<section id="calculator">
<div class="container">
    <table id="inputs"><tr>
        <td><input type="text" id="firstnumber"></td>
        <td><input type="text" id="secondnumber"></td>
       </tr>
</table>
<table id="operators" cellpadding="0" cellspacing="7">
    <tr>
        <td id="plus"><button onClick="addition()">+</button></td>
        <td id="minus"><button onClick="difference()">-</button></td>
    </tr>
    <tr><td id="multiply"><button onClick="multiplication()">*</button></td>
        <td id="divide"><button onClick="division()">/</button></td></tr>   
    <tr>
    <td colspan="2"><center><label id="result">result</label></center></td>
    </tr>
</table>
</div>
</section>
</body>
</html>


function additon()
{
var a = document.getElementById('firstnumber').value;
var b = document.getElementById('secondnumber').value;
document.getElementById("result") = a + b;
}
function difference()
{
var a = document.getElementById('firstnumber').value;
var b = document.getElementById('secondnumber').value;
document.getElementById("result").innerHTML = a - b;

}
function multiplication()
{
var a = document.getElementById('firstnumber').value;
var b = document.getElementById('secondnumber').value;
document.getElementById("result").innerHTML = a * b;

}
function division()
{
var a = document.getElementById('firstnumber').value;
var b = document.getElementById('secondnumber').value;
document.getElementById("result").innerHTML = a / b;

}

Answer 1

您的代码存在四个主要问题。

首先，整个JavaScript代码（以“function addition（）”开头）不在script标签内。目前它只是被解释为文本，这就是你加载方时应该在底部看到它的原因。要解决此问题，您必须将代码嵌入脚本标记中。最简单的方法是在head标签内，如下所示：

<!DOCTYPE html>
<html>
<head>
<title>Calc+</title>
<link rel="stylesheet" href="calculator.css">
<script>
    function additon()
    //other functions here
</script>
</head>
<body>

其次，加法函数不设置innerHTML。只需像使用其他函数一样设置innerHTML。

第三，如果在尝试时获得值，则类型实际上是一个字符串。如果你做字符串+字符串，结果是一个连接。所以“1”+“1”=“11”。要更改此项，只需在添加案例中在a之前添加+，如下所示 document.getElementById（“result”）。innerHTML = + a + b; （感谢Frederik Hansen在评论中指出了这一点。）

第四，添加功能未正确命名。你写了additon，但你的意思是补充。

我的javascript计算器不起作用

1 个答案: