Necesito ayuda para poder repartir el #aporte (total) en la cantidad de personas ingresadas en el botón (no puedo usar un tipo de entrada número, necesito usar el tipo de entrada texto y cuando ingresas un nombre y haces clic en el botón, se añadirá a la distribución). Realmente no sé cómo hacerlo, aquí está el código:
HTML:
<h1>Expenses app</h1> <p>Enter how much each person spent</p> <p>Nombre</p> <input type="text" id="nombre"> <br> <p>Monto</p> <input type="number" id="monto"> <br> <button onclick="ir()">Enviar</button> <br> <p>Total: <span id="final"></span> </p> <div id="total"> </div> <p>A cada uno le toca aportar: <span id="aporte"></span></p>guion:
function ir() { const nombre = document.getElementById("nombre").value; let monto = document.getElementById("monto").value; const total = document.getElementById("total"); const final = document.getElementById("final"); const aporte = document.getElementById("aporte"); const lineBreak = document.createElement("br"); let newTotal = document.createTextNode(` ${nombre} : ${monto} `); total.appendChild(lineBreak); total.appendChild(newTotal); monto = Number(monto) + Number(final.innerHTML); final.innerHTML = `${monto}`; aporte.innerHTML = `${monto}`; };Puedes probarlo :
const arr = [] const nombre = document.getElementById("nombre") const monto = document.getElementById("monto") const total = document.getElementById("total") const final = document.getElementById("final") const aporte = document.getElementById("aporte") const list = document.getElementById("list") const average = document.getElementById("average") function ir() { let nombreVal = nombre.value let montoVal = monto.value if(nombreVal === '' || montoVal === '') return let exist = arr.find(({name, score}) => name === nombreVal) if (exist) { exist.score = Number(montoVal) } else { arr.push({name:nombreVal, score: montoVal}) } let totalScore = arr.reduce((total, ele) => total += Number(ele.score), 0) let totalPeople = arr.length list.textContent = ''; arr.forEach(ele => { let nodeNombre = document.createElement('p') nodeNombre.innerHTML = ele.name + ': ' + ele.score list.appendChild(nodeNombre); }) final.innerHTML = `${totalScore}`; aporte.innerHTML = `${totalPeople}`; average.innerHTML = `average : ${totalScore/totalPeople}` }; <h1>Expenses app</h1> <p>Enter how much each person spent</p> <p>Nombre</p> <input type="text" id="nombre"> <br> <p>Monto</p> <input type="number" id="monto"> <br> <button onclick="ir()">Enviar</button> <br> <p>Total: <span id="final"></span> </p> <div id="list"></div> <div id="total"></div> <div id="total-people"></div> <p id="average"></p> <p>A cada uno le toca aportar: <span id="aporte"></span></p>