Hi im trying to calculate the percentage of 2 inputs but its not showing results can anyone tell me whats the problem
var Shots = document.getElementById("shots").value;
var Makes = document.getElementById("makes").value;
var results = (Makes / Shots) * 100;
function perqindja() {
document.getElementById("answer").innerHTML = results;
};
<h2>Calculate your shots</h2>
<p>Type the number of shots taken:</p>
<input type="number" name="Shots" id="shots">
<p>Type the number of shots made:</p>
<input type="number" name="Makes" id="makes">
<button onclick="Calculate()">Calculate</button>
<p>The shot percentage:<span id="answer"></span></p>
You should define the variable inside the function so that it could store the input
value after user click the button. Also, you doesn't define the Calculate()
. I remove the perqindja()
since I don't find it user in the code.
function Calculate() {
var Shots = document.getElementById("shots").value;
var Makes = document.getElementById("makes").value;
var results = (Makes / Shots) * 100;
document.getElementById("answer").innerHTML = results;
};
<p>Type the number of shots taken:</p>
<input type="number" name="Shots" id="shots">
<p>Type the number of shots made:</p>
<input type="number" name="Makes" id="makes">
<button onclick="Calculate()">Calculate</button>
<p>The shot percentage:<span id="answer"></span></p>
The first problem is that the function Calculate is not defined. By the way, in javascript it is a good practice to give function lower case names. Second, you need to pass values to the calculate function.
Everything should work once you fix these 2 issues.
Your functions name is ‘perqindja()’ but you try to call ‘ Calculate()’ function on click in your html