Saya cuba mencari jumlah nilai yang dimasukkan oleh pengguna. Dapatkan agregat yang mendarab nombor dengan nilai yang sama
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>
Sila cuba ini. Ini akan berfungsi untuk anda.