HTML and Javascript making a simple addition calculator

Question

I'm trying to make a simple addition calculator. You put two values into the boxes and click the "+" sign and the third box has the sum. However, it looks like everything is right to me but when I click the + sign nothing happens

Check the console - your code will be throwing an error because you mistyped (or misremembered) the getElementById method. And please post code as code, not as an image (let alone a link to an image). — Robin Zigmond
– Robin Zigmond, Commented Nov 6, 2019 at 21:04
1. There is no getElementsById method, because it is not meant to have two elements with the same id. There is only getElementById, and it returns one element (not an array). 2. Please do not post your code as image. — CoderCharmander
– CoderCharmander, Commented Nov 6, 2019 at 21:07

King11 · Accepted Answer · 2019-11-08 18:20:00Z

3

First you should change getElementsById() to getElementById() because there is only one id per element.

<input type="text" id="box1"><br/>
<input type="text" id="box2"><br/>
<input type="text" id="+"><br/>
<input type="button" value="+" onclick="calcSum()"><br/>

<script>
function calcSum(){
let box1 = document.getElementById("box1").value;
let box2 = document.getElementById("box2").value;
let sum = Number(box1) + Number(box2);
document.getElementById("+").value = sum;
}
</script>

edited Nov 8, 2019 at 18:20

answered Nov 6, 2019 at 21:21

King11

1,2293 gold badges9 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

HTML and Javascript making a simple addition calculator

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related