不能做简单的jquery数学运算

-5

im试图做一个有点简单的计算表：这里是完整的HTML页面的脚本和表单元素。不能做简单的jquery数学运算

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Payback Calc</title> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" /> 
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script> 
<link rel="stylesheet" href="js/jquery-mobile-fluid960.min.css"> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/2.2.0/knockout-min.js">  </script> 
<script> 
function getvals(){ 
var homesq = $('#homesq').val(); 
var roofcasq = $('#roofcasq').val(); 
var costpsq = $('#costpsq').val(); 
var epahcc = $('#epahcc').val(); 
var narc = $('#narc').val(); 
var eeshc = $('#eeshc').val(); 
var cpg = $('#cpg').val(); 
var galneed = $('#galneed').val(); 
var pce = $('#pce').val(); 
var hcc=$('#hcc').val(); 
var eae=$('#eae').val(); 
var ees10=$('#ees10').val(); 
var ees15=$('#ees15').val(); 
var ees20=$('#ees20').val(); 
var epbpso=$('#epbpso').val(); 
var epbcac=$('#epbcac').val(); 
var eacs=$('#eacs').val(); 
var ts=$('#ts').val(); 
var epbop=$('#epbop').val(); 
var tc=$('#tc').val(); 


galneed = roofcasq/225; 
pce = galneed * cpg; 
hcc = homesq * epahcc; 
eae = hcc * eeshc; 
ees10 = eae * 10; 
ees15 = eae * 15; 
ees20 = eae * 20; 
epbpso = pce/eae; 
epbcac = roofcasq * costpsq; 
eacs = narc * roofcasq; 
ts = eae + eacs; 
tc = pce + epbcac; 
epbop = tc/ts; 
} 
</script> 
</head> 
<body> 
<div data-role="page" id="page"> 
    <div data-role="header"> 
    <h1>Header</h1> 
    </div> 
    <div data-role="content"> 

<table width="100%" align="center"> 
<tr height="100px" > 
<td><label for="homesq"><h2>Home Square Footage:</h2></label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="homesq" id="homesq" placeholder="" data-role="none" ></td> 
</tr> 
<tr> 
<td><label for="roofcasq"><h2>Roof Coverage Area in Square Feet:</h2></label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="roofcasq" id="roofcasq" placeholder="" data-role="none"data-role="none" ></div></td> 
</tr> 
<tr > 
<td><label for="costpsq"><h2>Cost Per S.F. for Roof Cleaning & Application:</h2></label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="costpsq" id="costpsq" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td><label for="epahcc"><h2>U.S. EPA Average Residential Heating & Cooling Costs:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;"type="text" name="epahcc" id="epahcc" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr > 
<td ><label for="narc"><h2>U.S. National Average for Roof Cleaning:</h2></label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="narc" id="narc" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td><label for="eeshc"><h2>Estimated Energy Savings for Heating & Cooling:</h2></label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="eeshc" id="eeshc" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr > 
<td ><label for="cpg"><h2>Cost Per Gallon for Nansulate Crystal: </h2></label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="cpg" id="cpg" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td><label for="galneed"><h2>Gallons Needed (includes 10% extra for loss):</h2></label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="galneed" id="galneed" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="pce"><h2>Product Cost Estimate (does not include shipping):</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="pce" id="pce" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="hcc"><h2>Estimated Annual Heating & Cooling Costs:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="hcc" id="hcc" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="eae"><h2>Estimated Annual Energy Savings:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="eae" id="eae" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="ees10"><h2>Estimated Energy Savings Through 10-Year Warranty Period:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="ees10" id="ees10" placeholder="" data-role="none"></div></td> 
</tr> 
<tr> 
<td ><label for="ees15"><h2>Estimated Energy Savings Through 15 Years:</h2><p>(Expected lifespan is 10-20 years or more, depending upon climate)</p></label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="ees15" id="ees15" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="ees20"><h2>Estimated Energy Savings Through 20-years:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="ees20" id="ees20" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="epbpso"><h2>Estimated Payback on Product/Savings Only:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="epbpso" id="epbpso" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="epbcac"><h2>Estimated Roof Cleaning & Application Cost:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="epbcac" id="epbcac" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="eacs"><h2>Estimated Annual Cleaning Savings:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="eacs" id="eacs" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="ts"><h2>Total Savings - Annual Energy Savings and Cleaning:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="ts" id="ts" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="epbop"><h2>Estimated Payback on Product + Annual Cleaning:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="epbop" id="epbop" placeholder="" data-role="none" ></div></td> 
</tr> 
<tr> 
<td ><label for="tc"><h2>Total Cost of Product and Application:</h2> </label></td> 
<td width="25%"><input style="font-size:30px;" type="text" name="tc" id="tc" placeholder="" data-role="none" ></div></td> 
</tr> 

</table> 
<a data-role="button" onClick="getvals()">calculate</a> 
    <a data-role="button" onClick="console()">calculate</a> 
</div> 
    <div data-role="footer"> 
    <h4>Footer</h4> 

    </div> 
</div> 

</body> 
</html>

控制台显示没有错误。只是该网页没有做任何事情。

我使用的是最新版本的jQuery mobile。

我在做什么错？

来源

2013-02-28 Jayrok94

你真的在调用函数getvals（）吗？ – 2013-02-28 15:12:17

你为什么期待*这段代码做任何事情？你能指望什么？你的网页是什么样的？ – 2013-02-28 15:12:18

我不知道你的期望，但你有没有尝试过在你的页面加载调用函数？ '$（getvals（））;' – NielsInc 2013-02-28 15:13:22

有一对夫妇，你不需要做任何你正在做的与HTML输入数学运算时间一般的东西：

装饰的白色空间（$.trim是你的朋友，如果你使用jQuery）
转换为数字。整数使用parseInt(..., 10)，否则使用parseFloat()。

您还需要计算值写回向页面，当然！

这将是一个真的良好的使用Knockout JS，这将允许您绑定您的表单输入到数据模型，并让该表单在您更改值时自动更新。

来源

2013-02-28 15:13:56 Alnitak

你没有把你在任何地方计算的值。您需要在页面上创建一些元素，并将其内容/值（取决于元素的类型）设置为您计算的值。

当然，你需要有一些调用你的函数的元素。

来源

2013-02-28 15:13:16 hexblot

不能做简单的jquery数学运算

回答

相关问题