在jQuery中添加多個文本框計算值

我有輸入時在同一個文本框上計算的文本框。我想要的是將它們全部添加到最終結果中。我試過使用我的舊功能。下面是它的外觀：在jQuery中添加多個文本框計算值

function compute(){ 
    var quiz = document.getElementById('quiz').value; 
    var recitation = document.getElemenById('recitation').value; 
    var homework = document.getElementById('homework').value; 
    var seatwork = document.getElementById('seatwork').value; 
    var activities = document.getElementById('activities').value; 
    var exams = document.getElementById('exams').value; 
    var project = document.getElementById('project').value; 
    var total = document.getElementById('total').value; 
    var grade = quiz+recitation+homework+seatwork+activities+exams+project; 
    total.value = grade; 
}

而且我在每個文本框上都放上了oninput =「compute（）」。但它不是相互作用的。可能是我的錯誤？它可能是功能在一個點上相撞嗎？

編輯：我創建了一個測試頁面。基本上是一樣的。在這裏你去：

<!DOCTYPE html> 
<head> 
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
     <title>Test</title> 
</head> 

<body> 
<input id="first" type="text" onchange="compute()"> 

<script> 
$('#first').on('change', function() { 
    $(this).val($(this).val() * 3); 
}); 
</script> 

<input id="second" type="text" onchange="compute()"> 

<script> 
$('#second').on('change', function() { 
    $(this).val($(this).val() * 3); 
}); 
</script> 


<input id="result" type="text" readonly> 

<script> 
     function compute(){ 
       var myBox1 = document.getElementById('first').value; 
       var myBox2 = document.getElementById('second').value; 
       var result = document.getElemetById('result').value; 
       var grade = first + second; 
       total.value = grade; 
     } 
</script> 

</body> 
</html>

來源

2014-10-10 Benedict John Payot

我沒有時間給你一個答案，但儘量避免從HTML調用事件。混合html和JavaScript被認爲是不好的做法。爲此使用事件監聽器。 – iovis 2014-10-10 23:39:53

onChange="compute();"

你嘗試了嗎？

編輯：你可能還必須更改total.value = grade;到total = grade;或類似的東西。我相信這個函數可以寫得更簡單一些，但我不知道你的完整代碼。

來源

2014-10-10 22:55:41 koljanep

我已經試過了。仍然不起作用。 – 2014-10-10 23:03:52

我明白了。你可以發佈你的HTML和jQuery代碼嗎？ – koljanep 2014-10-10 23:05:28

感謝發佈代碼。在上面，將'total.value = grade;'改爲'$（'＃result'）。val（grade）;' – koljanep 2014-10-11 09:58:04

在jQuery中添加多個文本框計算值

回答

相關問題