不能做簡單的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數學運算

回答

相關問題