傳遞函數的結果給另一個函數變量在Javascript

Question

請原諒我的無知，因爲我很新的Java腳本。這是我想要做的。我有一個表格，用戶可以在數據輸入給報銷。它總結水平總計起來，然後採取最終值和垂直方向上增加了他們的總計。 我擁有一切工作的水平，我可以垂直添加最後5行，但是當我在第一個兩行添加，這是行不通的。我得到NaN的答案。這是代碼。

<script type="text/javascript"> 
function calcWages(){ 
    document.getElementById('wages').innerHTML = ''; 
    var num2 = new Number(document.getElementById('hours').value); 
    var num3 = new Number(document.getElementById('rate').value); 
    document.getElementById('wages').innerHTML = ((num3 * num2).toFixed(2)); 
} 

function calcMilage(){ 
    document.getElementById('milage').innerHTML = ''; 
    var num4 = new Number(document.getElementById('miles').value); 
    document.getElementById('milage').innerHTML = ((num4 * .555).toFixed(2)); 
} 

function calcTotal(){ 
    document.getElementById('total').innerHTML = ''; 
    var num5 = new Number(document.getElementById('wages').value); 
    var num6 = new Number(document.getElementById('milage').value); 
    var num7 = new Number(document.getElementById('travel').value); 
    var num8 = new Number(document.getElementById('lodging').value); 
    var num9 = new Number(document.getElementById('food').value); 
    var num10 = new Number(document.getElementById('office').value); 
    var num11 = new Number(document.getElementById('other').value); 
    document.getElementById('total').innerHTML = ((num5 + num6 + num7 + num8 + num9 + num10 + num11).toFixed(2)); 
} 

window.onload=function(){ 
    document.getElementById('totalCalc').onclick = calcTotal; 
} 
</script> 


<table> 
<tr> 
<td></td> 
<td></td> 
<td></td> 
<td> 
Total: 
</td> 
    <td></td> 
    <td> 

    </td> 
</tr> 
<tr> 
<td>Wages:</td> 
<td>Hours:(8 a day Max)<input type="text" name="hours" id="hours" size="3" maxlength="3" onchange="calcWages()"></td> 
<td>Rate:<input type="text" name="rate" id="rate" size="3" maxlength="5" onchange="calcWages()"></td> 
<td>=</td> 
<td><div id="wages"></div></td> 
</tr> 
<tr> 
<td>Milage:</td> 
<td>Miles<input type="text" name="miles" id="miles" size="3" maxlength="4" onchange="calcMilage()"></td> 
<td>IRS rate ($0.555)</td> 
<td>=</td> 
<td><div id="milage"></div></td> 
</tr> 
<tr> 
<td> 
    Travel: </td> 
<td colspan="2"> 
    <input type="text" name="tavelitem" id="travelitem" size="36"> </td> 
<td> 
     = 
    </td> 
<td><input type="text" name="travel" id="travel" size="3"> </td> 
</tr> 
<tr> 
<td>Lodging:</td> 
<td colspan="2"><input type="text" name="lodgingitem" id="lodgingitem" size="36"> </td> 
<td>=</td> 
<td><input type="text" name="lodging" id="lodging" size="3"></td> 
</tr> 
<tr> 
<td>Food:</td> 
<td colspan="2"><input type="text" name="fooditem" id="fooditem" size="36">   </td> 
<td>=</td> 
<td><input type="text" name="food" id="food" size="3"></td> 
</tr> 
<tr> 
<td>Office Supplies:</td> 
<td colspan="2"><input type="text" name="officesupplies" id="officesupplies" size="36"> </td> 
<td>=</td> 
<td><input type="text" name="office" id="office" size="3"></td> 
</tr> 
<tr> 
<td>Other:</td> 
<td colspan="2"><input type="text" name="otheritem" id="otheritem" size="36"></td> 
<td>=</td> 
<td><input type="text" name="other" id="other" size="3"></td> 
</tr> 
<tr> 
<td></td> 
<td><button id="totalCalc">Total</button></td> 
<td>Grand Total:</td> 
<td>=</td> 
<td><div id="total"></div></td> 
</tr> 
</table> 

的calcWages功能和calcMilage職能的工作，但我似乎越來越掛斷了電話，並讓這兩種結果，在calcTotal功能工作。如果這沒有意義，我很抱歉。讓我知道，我會盡力澄清。謝謝。

Answer 1

他們函數不返回任何東西，所以你不能真正得到他們結果。但是，你可以呼叫他們裏面calcTotal：

function calcTotal(){ 
    calcWages(); 
    calcMilage(); 
    // ... 
} 

---

從我的意見：當你看到自己使用的變量名稱與正在運行的指標，使用數組和/或循環很可能是更好的解決方案。

不改變你的HTML，更清潔的解決方案是：

var fields = ['wages', 'milage', ...]; 

function calcTotal(){ 
    var sum = 0; 
    for (var i = 0; i < fields.length; i++) { 
     sum += +document.getElementById(fields[i]).value 
    } 
    document.getElementById('total').innerHTML = sum.toFixed(2); 
} 

您也可以給元素的通用類，以避免在數組中列出他們的ID。

Answer 2

在這裏，我們設置.innerHTML

document.getElementById('milage').innerHTML = ((num4 * .555).toFixed(2)); 
//         ^^^ 

但後來你從同一個元素得到.value。

var num6 = new Number(document.getElementById('milage').value); 
//              ^^^ 

---

好像你應該使用一個或另一個。如果.innerHTML適用於第一個，那麼您應該取回它，反之亦然（除非可能這是一個textarea元素）。

---

要麼，你打算使用miles元素，而不是milage。

var num6 = new Number(document.getElementById('miles').value); 
//            ^^^ 

Answer 3

<script type="text/javascript"> 
     function calcWages(){ 
      document.getElementById('wagestotal').innerHTML = ''; 
      var hours = new Number(document.getElementById('hours').value); 
    var rate = new Number(document.getElementById('rate').value); 
      document.getElementById('wagestotal').innerHTML = ((hours * rate).toFixed(2)); 

     } 

     function calcMilage(){ 
      document.getElementById('milagetotal').innerHTML = ''; 
      var miles = new Number(document.getElementById('miles').value); 
    document.getElementById('milagetotal').innerHTML = ((miles * .555).toFixed(2)); 
       } 


     function calcTotal(){ 
      document.getElementById('total').innerHTML = ''; 
     var wages = new Number(document.getElementById('wagestotal').innerHTML); 
     var milage = new Number(document.getElementById('milagetotal').innerHTML); 
     var travel = new Number(document.getElementById('travel').value); 
     var lodging = new Number(document.getElementById('lodging').value); 
     var food = new Number(document.getElementById('food').value); 
     var office = new Number(document.getElementById('office').value); 
     var other = new Number(document.getElementById('other').value); 
document.getElementById('total').innerHTML = ((wages + milage + travel + lodging + food + office + other).toFixed(2)); 
     } 
     window.onload=function(){ 
      document.getElementById('totalCalc').onclick = calcTotal; 
     } 

     </script> 

因此，這是最終的腳本。我改變了變量的事情有意義的名字。我得到的最後一手牌是能夠將薪資函數和總收入的總和計算在內。我搞砸的部分是，我有：

var wages = new Number(document.getElementById('wagestotal').value); 
var milage = new Number(document.getElementById('milagetotal').value); 

相反的：

var wages = new Number(document.getElementById('wagestotal').innerHTML); 
var milage = new Number(document.getElementById('milagetotal').innerHTML); 

在calcTotal功能可按。用戶可以將這些東西輸入到與之相關的表單中，並且它們都可以像應該那樣進行彙總。再次感謝幫助集中我的想法。