添加所有Javascript Divs总金额

时间:2014-01-05 23:02:27

标签: javascript html math

好的,所以我有一个javascript函数设置来添加一个ID为up的div并将其总计,并将值显示在顶部。嗯它的工作正常,但是由于它是多重身份,我对如何获得总数感到困惑!

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分开如:own1然后例如拥有2。

<!-- 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>

那么,当我更改property1的表单时,它是如何成为onkeyup函数的。它将显示数学总计。但是,如果我更改了property2的表单,它将显示属性2的总数学数据。如何将它添加2并显示两者的总数?我将会有大约15种不同的价值,当你改变价值的时候,我对于该做什么感到困惑,请帮助!!谢谢!! 要了解我正在谈论的内容,请访问以下网站:http://psychowars.net/addtrain/property_cost

2 个答案:

答案 0 :(得分:0)

我不确定你想要什么。假设您希望得到总数(所有收入*的总和)并将其放在#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()));
}
来自玻利维亚拉巴斯的欢呼声

答案 1 :(得分:0)

#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);