我想計算我的輸入框內部循環，如果完成，請幫我解決這個問題<?php$jumlah_form = 3; for($i=1; $i<=$jumlah_form; $i++){ ?> <input type="text" id="txt1" onkeyup="sum1();" /></br> <?php } ?> <input type="text" id="txt2" value= "0" /></br> <script> function sum1() { var txtFirstNumberValue = document.getElementById('txt1').value; var txtSecondNumberValue = document.getElementById('txt2').value; var result = parseInt(txtFirstNumberValue) + parseInt(txtFirstNumberValue) ; if (!isNaN(result)) { document.getElementById('txt2').value = result; } } </script>通過循環創建三個輸入框，我想計算三個輸入框，并在用戶輸入數字時將結果解析為結果框
2 回答
天涯盡頭無女友
TA貢獻1831條經驗 獲得超9個贊
我想您是在問如何編寫 JavaScript 以便將所有輸入框的總數加起來，無論 PHP 創建了多少？
如果是這樣，那么一個好方法是為所有文本框提供相同的類。然后，JavaScript 可以選擇具有該類的所有框，遍歷它們并獲得總值。
這是一個使用 3 個文本框的工作示例（就好像 PHP 以這種方式生成它們一樣）：
var textboxes = document.querySelectorAll(".sum");
textboxes.forEach(function(box) {
box.addEventListener("keyup", sumAll);
});
function sumAll() {
var total = 0;
textboxes.forEach(function(box) {
var val;
if (box.value == "") val = 0;
else val = parseInt(box.value);
total += val;
});
document.getElementById("total").innerText = total;
}
<input type="number" id="txt1" class="sum" value="0" /><br/>
<input type="number" id="txt2" class="sum" value="0" /><br/>
<input type="number" id="txt3" class="sum" value="0" /><br/>
<br/><br/> Total: <span id="total"></span>
largeQ
TA貢獻2039條經驗 獲得超8個贊
用 php 生成 html：
$count = 5;
for($i=1;$i <= $count;$i++) {
echo "<input type='number' id='"."txt".i."' /></br>"
}
從輸入計算總和：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello World</title>
</head>
<body>
<form onsubmit="submitForm(this); return false;" >
<input type="number" id='text1'>
<input type="number" id='text2'>
<input type="number" id='text3'>
<input type="number" id='text4'>
<input type="number" id='text5'>
<button type="submit" >Calculate</button>
</form>
<div>
<p>Result:</p>
<p id='result'></p>
</div>
<script>
function submitForm(form) {
let toReturn = 0;
const inputs = form.getElementsByTagName("input");
for(let x = 0; x < inputs.length; x++ ) {
toReturn += parseInt(inputs[x].value ? inputs[x].value : 0);
}
document.getElementById('result').innerHTML = toReturn;
return false;
}
</script>
</body>
</html>
- 2 回答
- 0 關注
- 229 瀏覽
添加回答
舉報
0/150
提交
取消