How to append answer in h1?

Question

 I'm trying to do a simple calculator by input value but it doesn't seem to appear on my h1. Can somebody help me? i also want to make the variables work outside the function. function addition(){ let $first = $('#first').val(); let $second = $('#second').val(); $('h1').append($first + $second); }

 <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>A Great Demo on CodePen</title> </head> <body> <input type='text' id='firstNum' placeholder='Enter First Number'> <input type='text' id='secondNum' placeholder='Enter Second Number'> <button id='add' onclick='addition()'>Add</button> <button id='sub' onclick='subtraction()'>Subtract</button> <button id='multi' onclick='multiplication()'>Multiply</button> <button id='divide' onclick='division()'>Divide</button> <h1></h1> <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> </body> </html>

Answer 1

I'm wondering how calculator will work with two inputs but anyway

Your ids is wrong its #firstNum and #secondNum not #first / #second -
And you need to use parseInt or parseFloat to convert string to integer

 function addition(){ let $first = parseFloat($('#firstNum').val()); let $second = parseFloat($('#secondNum').val()); $('h1').html($first + $second); }

 <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>A Great Demo on CodePen</title> </head> <body> <input type='text' id='firstNum' placeholder='Enter First Number'> <input type='text' id='secondNum' placeholder='Enter Second Number'> <button id='add' onclick='addition()'>Add</button> <button id='sub' onclick='subtraction()'>Subtract</button> <button id='multi' onclick='multiplication()'>Multiply</button> <button id='divide' onclick='division()'>Divide</button> <h1></h1> <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script> </body> </html>

I suggest to search for a calculator using html,css,javascript there're tons of it out there

How to append answer in h1?

Question

1 answers

solution1
0 2021-01-06 03:30:11

How to append answer in h1?

Question

1 answers

solution1 0 2021-01-06 03:30:11

solution1
0 2021-01-06 03:30:11