Get the total return value of the input field method
I'm trying to find the total value entered by the user. Get an aggregate that multiplies numbers with their identical values
let Dem200 = document.querySelector(".input_200");
let output200 = document.querySelector(".result_200");
Dem200.addEventListener('blur', function() {
let result200 = parseInt(Dem200.value) * 200;
output200.innerHTML = result200;
})
let Dem100 = document.querySelector(".input_100");
let output100 = document.querySelector(".result_100");
Dem100.addEventListener('blur', function() {
let result100 = parseInt(Dem100.value) * 100;
output100.innerHTML = result100;
})
let Dem50 = document.querySelector(".input_50");
let Dem20 = document.querySelector(".input_20");
let Dem10 = document.querySelector(".input_10");
let Dem5 = document.querySelector(".input_5");
let Dem1 = document.querySelector(".input_1");
let output50 = document.querySelector(".result_50");
let output20 = document.querySelector(".result_20");
let output10 = document.querySelector(".result_10");
let output5 = document.querySelector(".result_5");
let output1 = document.querySelector(".result_1");
Dem50.addEventListener('blur', function() {
let result50 = parseInt(Dem50.value) * 50;
output50.innerHTML = result50;
})
Dem20.addEventListener('blur', function() {
let result20 = parseInt(Dem20.value) * 20;
output20.innerHTML = result20;
})
Dem10.addEventListener('blur', function() {
let result10 = parseInt(Dem10.value) * 10;
output10.innerHTML = result10;
})
Dem5.addEventListener('blur', function() {
let result5 = parseInt(Dem5.value) * 5;
output5.innerHTML = result5;
})
Dem1.addEventListener('blur', function() {
let result1 = parseInt(Dem1.value) * 1;
output1.innerHTML = result1;
})
window.onchange = function() {
var inputs = document.getElementsByTagName('input'),
resultinchancge = document.getElementById('total'),
sum = 0;
for (var i = 0; i < inputs.length; i++) {
var ip = inputs[i];
if (ip.name && ip.name.indexOf("total") < 0) {
sum += parseInt(ip.value) || 0;
}
}
resultinchancge.value = sum;
}
<!DOCTYPE html>
<html>
<head>
<style>
table,
th,
td {
border: 0px solid;
font-size: 30px;
}
input {
font-size: 30px;
}
input {
text-align: center;
}
</style>
</head>
<body>
<table>
<tr>
<th>200</th>
<th><input name="notes200" type="text" class="input_200"></th>
<th class="result_200"></th>
</tr>
<tr>
<th>100</th>
<th><input name="notes100" type="text" class="input_100"></th>
<th class="result_100"></th>
</tr>
<tr>
<th>50</th>
<th><input name="notes50" type="text" class="input_50"></th>
<th class="result_50"></th>
</tr>
<tr>
<th>20</th>
<th><input name="notes20" type="text" class="input_20"></th>
<th class="result_20"></th>
</tr>
<tr>
<th>10</th>
<th><input name="notes10" type="text" class="input_10"></th>
<th class="result_10"></th>
</tr>
<tr>
<th>5</th>
<th><input name="notes5" type="text" class="input_5"></th>
<th class="result_5"></th>
</tr>
<tr>
<th>1</th>
<th><input name="notes1" type="text" class="input_1"></th>
<th class="result_1"></th>
</tr>
<tr>
<th>Total1</th>
<th><input type="text" name="totalnotes" id="total" /></th>
</tr>
</table>
</body>
</html>
