簡體   English   中英

如何創建一個函數,將#aporte 與人數一起分配,但不使用輸入類型編號,而是使用輸入類型文本?

[英]How can I make a function that distributes the #aporte with the number of people but not using input type number, instead using input type text?

我需要幫助,以便我可以在按鈕中輸入的人數中分配#aporte(總計)(我不能使用輸入類型編號,我需要使用輸入類型文本,當您輸入名稱並單擊時按鈕,它將被添加到分發中)。 我真的不知道該怎么做,這是代碼:

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>

腳本:

  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}`;
  };

你可以試試 :

 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>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM