mi código calcula el AVG o MAX de un conjunto de números de entrada, quiero que el usuario marque una lista de casillas de verificación que contiene AVG y MAX para el resultado deseado, pero no pude resolverlo.
si pongo una entrada de "2,4" sin verificar la lista, la salida es tanto AVG como MAX, que es 3 4, traté de hacer una lista de verificación solo para el resultado AVG o MAX, pero no funcionó.
He verificado ambas funciones, calcular AVG () y calcular MAX (), y producen la salida correcta
function proccesFloat(flt) { var splitFloat = flt.split(","); for (x in splitFloat) { splitFloat[x] = parseFloat(splitFloat[x]); } return splitFloat; } function calculateAVG(setNum) { let total = 0; var numInput = document.getElementById("setNum").value; var result = 0; var avg = proccesFloat(numInput); for (let i = 0; i < avg.length; i++) { total += avg[i]; } result = total / avg.length; document.getElementById('outputAVG').innerHTML = result; } function calculateMAX(setNum) { var numInput = document.getElementById("setNum").value; var numarry = proccesFloat(numInput); var max = 0; for (let i = 0; i < numarry.length; i++) { if (numarry[i] > max) { max = numarry[i]; } } document.getElementById('outputMAX').innerHTML = max; } function calculate() { var checkBox = document.getElementsByTagName("check"); if (checkBox[0].checked) { calculateAVG(document.getElementById("setNum")); } if (checkBox[0].checked) { calculateMAX(document.getElementById("setNum")); } { alert('please choose formula') return false; } } <header> <input type="Numbers" id="setNum" placeholder="Enter Set of Numbers"> <br> <button onclick="calculate()" id="btn1">calculate</button> <output id="outputAVG"></output> <output id="outputMAX"></output> <form method="post"> <fieldset> <legend>Formula To Calculate?</legend> <input type="checkbox" id="avg" name="check" onclick="calculate()">AVG<br> <input type="checkbox" id="max" name="check" onclick="calculate()">MAX<br> <br> </fieldset> </form> </header>Cuente los marcados y luego mire las identificaciones.
También sugiero que envuelva en un formulario y use el evento de envío
Hice algunos cambios más para simplificar el código.
Deje que las funciones hagan una cosa y use el evento para unirlas
const proccesFloat = flt => flt.split(",").map(fl => +fl); // cast to float const calculateAVG = setNum => { const arr = proccesFloat(setNum); const total = arr.reduce((a, b) => a + b) return total / arr.length; } const calculateMAX = setNum => Math.max(...proccesFloat(setNum)); document.getElementById("calcForm").addEventListener("submit", function(e) { e.preventDefault(); // stop submission const chks = document.querySelectorAll("[name=check]:checked") if (chks.length === 0) { alert('please choose formula') return } if (document.getElementById("avg").checked) { document.getElementById('outputAVG').innerHTML = calculateAVG(document.getElementById("setNum").value); } if (document.getElementById("max").checked) { document.getElementById('outputMAX').innerHTML = calculateMAX(document.getElementById("setNum").value); } }) <header> <form id="calcForm"> <input type="Numbers" id="setNum" placeholder="Enter Set of Numbers"> <br> <button type="submit">calculate</button> <output id="outputAVG"></output> <output id="outputMAX"></output> <fieldset> <legend>Formula To Calculate?</legend> <input type="checkbox" id="avg" name="check">AVG<br> <input type="checkbox" id="max" name="check">MAX<br> <br> </fieldset> </form> </header>