簡體   English   中英

如何使用javascript從總金額中找到折扣

[英]how to find discount from total sum using javascript

我有一個表,用戶可以根據需要動態添加一行。 正如您在表格下方所看到的,這是動態添加的最后一列值的總和。 我需要在該文本框的總和上方添加兩個文本框(名稱為折扣)從用戶獲取輸入(作為數字),第二個文本框(名稱為 finalsum)將輸出顯示為值(finalsum=sum-discount) . 如果用戶沒有給出任何輸入值,那么折扣最初應該為零。 和 finalsum 應該等於 sum

如果您想了解更多信息,請告訴我,謝謝! 任何幫助將不勝感激 :)

 <html> <head> <title>Add/Remove dynamic rows in HTML table</title> <script language="javascript"> function addRow(tableID) { var table = document.getElementById(tableID); var rowCount = table.rows.length; if (rowCount < 4) { // limit the user from creating fields more than your limits var row = table.insertRow(rowCount); var colCount = table.rows[0].cells.length; row.id = "row_" + rowCount; for (var i = 0; i < colCount; i++) { var newcell = row.insertCell(i); newcell.outerHTML = table.rows[0].cells[i].outerHTML; } var listitems = row.querySelectorAll("input, select"); for (i = 0; i < listitems.length; i++) { listitems[i].setAttribute("oninput", "calculate('" + row.id + "')"); } } else { alert("Maximum Passenger per ticket is 4."); } } function calculate(elementID) { var mainRow = document.getElementById(elementID); var myBox1 = mainRow.querySelectorAll("[name=qty]")[0].value; var myBox3 = mainRow.querySelectorAll("[name^=sel]")[0].value; var total = mainRow.querySelectorAll("[name=total]")[0]; var myResult1 = myBox1 * myBox3; total.value = myResult1; // calculate the totale of every total var sumContainer = document.getElementById("totalOfTotals"); var totalContainers = document.querySelectorAll("[name=total]"), i; var sumValue = 0; for (i = 0; i < totalContainers.length; ++i) { sumValue += parseInt(totalContainers[i].value); } sumContainer.textContent = sumValue; } </script> </head> <body> <input type="button" value="Add" onClick="addRow('dataTable')" /> <table id="dataTable" class="form" border="1"> <tbody> <tr id="row_0"> <p> <td> <label>Quantity</label> <input type="number" required="required" name="qty" oninput="calculate('row_0')" /> </td> <td> <label for="sel">Price</label> <select name="sel" id="sel" oninput="calculate('row_0')" required> <option value="" disabled selected>Choose your option</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> </td> <td> <label for="total">Total</label> <input type="text" required="required" class="small" name="total" /> </td> </p> </tr> </tbody> </table> <div> <tr> <span>Sum</span> <span id="totalOfTotals">0</span> </tr> </div> </body> </html>

解決方法在這里!!!

 <html> <head> <title>Add/Remove dynamic rows in HTML table</title> <script language="javascript"> function addRow(tableID) { var table = document.getElementById(tableID); var rowCount = table.rows.length; if (rowCount < 4) { // limit the user from creating fields more than your limits var row = table.insertRow(rowCount); var colCount = table.rows[0].cells.length; row.id = "row_" + rowCount; for (var i = 0; i < colCount; i++) { var newcell = row.insertCell(i); newcell.outerHTML = table.rows[0].cells[i].outerHTML; } var listitems = row.querySelectorAll("input, select"); for (i = 0; i < listitems.length; i++) { listitems[i].setAttribute("oninput", "calculate('" + row.id + "')"); } } else { alert("Maximum Passenger per ticket is 4."); } } function calculate(elementID) { var mainRow = document.getElementById(elementID); var myBox1 = mainRow.querySelectorAll("[name=qty]")[0].value; var myBox3 = mainRow.querySelectorAll("[name^=sel]")[0].value; var myBox4 = mainRow.querySelectorAll("[name=discount]")[0].value; var total = mainRow.querySelectorAll("[name=total]")[0]; var myResult1 = myBox1 * myBox3; total.value = myResult1-myBox4; // calculate the totale of every total var sumContainer = document.getElementById("totalOfTotals"); var totalContainers = document.querySelectorAll("[name=total]"), i; var sumValue = 0; for (i = 0; i < totalContainers.length; ++i) { sumValue += parseInt(totalContainers[i].value); } sumContainer.textContent = sumValue; } </script> </head> <body> <input type="button" value="Add" onClick="addRow('dataTable')" /> <table id="dataTable" class="form" border="1"> <tbody> <tr id="row_0"> <p> <td> <label>Quantity</label> <input type="number" required="required" name="qty" oninput="calculate('row_0')" /> </td> <td> <label for="sel">Price</label> <select name="sel" id="sel" oninput="calculate('row_0')" required> <option value="" disabled selected>Choose your option</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> </td> <td> <label for="discount">Discount</label> <input type="text" required="required" class="small" name="discount" oninput="calculate('row_0')" /> </td> <td> <label for="total">Total</label> <input type="text" required="required" class="small" name="total" /> </td> </p> </tr> </tbody> </table> <div> <tr> <span>Sum</span> <span id="totalOfTotals">0</span> </tr> </div> </body> </html>

暫無
暫無

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

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