我在用Javascript添加两个数字时犯了什么错误

What mistake I am doing while adding two numbers using Javascript

本文关键字:数字 两个 错误 什么 Javascript 添加      更新时间:2023-09-26

我尝试通过从文本框中获取值来添加两个数字,然后使用innerhtml进行计算并显示,但不起作用。我在这个代码中犯了什么错误?

<body onload="alert('Hey check out my Calculator')">
 <h1 align="center" >  functional calulator </h1>
 <div class="Calculator" align="center">
    <input type="text" name="text1" id="a1">Enter 1st Number <br><br>
    <input type="text" name="text2" id="a2">Enter 2nd Number<br><br>
    <button   onclick="add()" >Add</button>
    <p id="p1"></p>
    
    <script type="text/javascript"> 
        function add(){
            var a = document.getElementById("a1").value;
            var b = document.getElementByID("a2").value;
            var total = a + b;
            document.getElementById("p1").innerHTML = total;
            
            
        }
        </script>

您将它们作为字符串添加,以便将它们连接起来,您应该首先将它们解析为整数

var a = parseInt(document.getElementById("a1").value);
var b = parseInt(document.getElementById("a2").value);
var total = a + b;
document.getElementById("p1").innerHTML = total;

a,b是字符串。也许你想把它们解析成int?

试试这个-你犯了拼写错误-它的document.getElementById不是document.getElement ByID

<body onload="alert('Hey check out my Calculator')">
 <h1 align="center" >  functional calulator </h1>
 <div class="Calculator" align="center">
 	<input type="text" name="text1" id="a1">Enter 1st Number <br><br>
 	<input type="text" name="text2" id="a2">Enter 2nd Number<br><br>
 	<button   onclick="add()" >Add</button>
 	<p id="p1"></p>
 	
	<script type="text/javascript">	
		function add(){
           var a = document.getElementById("a1").value;
			var b = document.getElementById("a2").value;
            
			var total = parseInt(a) + parseInt(b);
			document.getElementById("p1").innerHTML = total;
			
			
		}
		</script>

getElementByID应为var b = document.getElementById("a2").value; 中的getElementById

并对您的a和b执行parseInt(),将它们视为一个数字。

<body onload="alert('Hey check out my Calculator')">
  <h1 align="center">  functional calulator </h1>
  <div class="Calculator" align="center">
    <input type="text" name="text1" id="a1">Enter 1st Number
    <br>
    <br>
    <input type="text" name="text2" id="a2">Enter 2nd Number
    <br>
    <br>
    <button onclick="add()">Add</button>
    <p id="p1"></p>
    <script type="text/javascript">
      function add() {
        var a = document.getElementById("a1").value;
        var b = document.getElementById("a2").value;
        var total = parseInt(a) + parseInt(b);
        document.getElementById("p1").innerHTML = total;
      }
    </script>