加起來所有的Javascript Divs For Total Amount

Question

好吧，所以我有一個javascript函數設置來添加一個帶有ID的div並將它加起來，並將值顯示在頂部。那麼它工作正常，所有，但由於它是多個Id的我很困惑如何獲得總數！

function GetCost(ID) { 
    var cost = $('#Cost'+ID).val(); 
    var income = $('#Income'+ID).val(); 
    var owned = $('#Own'+ID).val(); 
    var new_cost = number_format(cost * owned/10 + 1000); 
    $('#PropCost'+ID).html('Cost: $'+new_cost); 
    $('#TotalIncome').html(number_format(income * owned)); 
} 

正如你可以看到它是一個Div加一個ID。那麼這裏是多個div的HTML。他們與不同的Id分離如：owned1然後例如owned2。

<!-- Property Start--> 
<div id="PropBlock"> 
<form action="javascript:void" method="post"> 
<div id="PropName">News Stand</div> 
<div align="center"><img src="http://cdn0.mobwarsapp.com/rpg_images/opensocial/mob/ingame/territory/big/newsstand.gif" /></div> 
<div id="PropIncome">Income: $100</div> 
<div id="PropCost1" class="PropCost">Cost: $1,000</div> 
<div id="PropOwn" align="center"> 
Own: <input type="text" ID="Own1" value="0" size="3" maxlength="5" onkeyup="GetCost(1)" /> 
</div> 
<div id="PropBuy"> 
<select id="Numbers1"> 
<option value="1">1</option>  
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
<option value="6">6</option> 
<option value="7">7</option> 
<option value="8">8</option> 
<option value="9">9</option> 
<option value="10">10</option> 
</select> 
<input type="submit" value="Calculate" onClick="CalcProp(1)" /> 
<input type="hidden" id="Cost1" value="1000" /> 
<input type="hidden" id="Income1" value="100" /> 
<input type="hidden" id="Name1" value="News Stand" /> 
</form> 
</div> 
</div> 
<!-- Property End --> 
<!-- Property Start--> 
<div id="PropBlock"> 
<form action="javascript:void" method="post"> 
<div id="PropName">Empty Lot</div> 
<div align="center"><img src="http://cdn0.mobwarsapp.com/rpg_images/opensocial/mob/ingame/territory/big/empty_lot.gif" /></div> 
<div id="PropIncome">Income: $100</div> 
<div id="PropCost2" class="PropCost">Cost: $4,500</div> 
<div id="PropOwn" align="center"> 
Own: <input type="text" ID="Own2" value="0" size="3" maxlength="5" onkeyup="GetCost(2)" /> 
</div> 
<div id="PropBuy"> 
<select id="Numbers2"> 
<option value="1">1</option>  
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
<option value="6">6</option> 
<option value="7">7</option> 
<option value="8">8</option> 
<option value="9">9</option> 
<option value="10">10</option> 
</select> 
<input type="submit" value="Calculate" onClick="CalcProp(2)" /> 
<input type="hidden" id="Cost2" value="4500" /> 
<input type="hidden" id="Income2" value="100" /> 
<input type="hidden" id="Name2" value="Empty Lot" /> 
</div> 
</form> 
</div> 
<!-- Property End --> 

這裏是收入部。

<div id="Basic" align="center">Basic Properties: (Income: $<span id="TotalIncome">0</span>)</div> 

那麼，它是一個onkeyup函數，當我改變property1的形式。它將顯示數學總數。但是，如果我更改property2的表單，它將顯示屬性2的總數學計算。我如何將它添加2並顯示兩者的總和？我將有大約15個不同的，當你改變價值，所以我有點困惑在做什麼，請幫助！謝謝！！ 要了解我在說什麼，這裏是我的網站鏈接：http://psychowars.net/addtrain/property_cost

Answer 1

我不完全確定你想要什麼。假設你想（所有收入的總和*擁有）總把它放在#TotalIncome，在這裏你有（替代由這一切您GetCost）：

//Just calculates. Doesn't affect UI 
function getCostsById(ID) { 
    var cost = $('#Cost'+ID).val(); 
    var income = $('#Income'+ID).val(); 
    var owned = $('#Own'+ID).val(); 
    var new_cost = cost * owned/10 + 1000;   
    return { 
     cost: cost, 
     income: income, 
     owned: owned, 
     new_cost: new_cost 
    }; 
} 

//I assume total is sum of every income*owned 
function getTotalCost(){ 
    var total = 0; 
    for(var id=1; id<=10; id++){ 
     var costs = getCostsById(id) 
     total += costs.income * costs.owned; 
    } 
    return total; 
} 

//This affects UI 
function GetCost(ID){ 
    var costs = getCostsById(ID);  
    $('#PropCost'+ID).html('Cost: $'+number_format(costs.new_cost)); 
    $('#TotalIncome').html(number_format(getTotalCost())); 
} 

歡呼聲中，來自拉巴斯，玻利維亞

Answer 2

#TotalIncome僅修改了最近編輯過的房產的收入。在計算總數時，還需要包括所有其他房產位置。只需修改計算的功能。

$('#TotalIncome').html((income * owned)); 

要這樣：

var sum = 0; 
$('[id^="Own"]').each(function(){ 
    var id = $(this).attr('id'); 
    id = id.replace("Own",""); 
    sum += (($('#Income'+id).val())*$('#Own'+id).val()) 
}); 
$('#TotalIncome').html(sum);