2014-03-01 94 views
1

我正在使用表單並使用函數來創建返回,然後將其用於表單末尾的總計算。爲什麼函數返回undefined?

有兩個函數正在返回undefined,我一直未能找出原因。我相信我正確訪問表單元素。我使用控制檯日誌檢查了數組鍵並獲取有效數字。

任何幫助將是偉大的。我包含HTML &外部腳本。

HTML

<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head>  
    <title>Square Foot Form</title> 
    <script type="text/javascript" src="sqfoot_script.js"></script> 
    <link href="sqfoot_style.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
    <div id="wrap"> 
     <form action="" id="sqfoot" onsubmit="return false;"> 
     <div> 
      <div class="cont_order"> 
       <fieldset> 
       <legend>Calculate Your Rental Rate</legend> 
       <label> How many plants do you want to grow ? </label> 
       <select size="1" <select id="plantNumber" name="plantNumber" onchange="getNumberOfPlants();"> 
       <option value="None">Select number of plants</option> 
       <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> 
       <option value="11">11</option> 
       <option value="12">12</option> 
       <option value="13">13</option> 
       <option value="14">14</option> 
       <option value="15">15</option> 
       <option value="16">16</option> 
       <option value="17">17</option> 
       <option value="18">18</option> 
       <option value="19">19</option> 
       <option value="20">20</option> 
       <option value="21">21</option> 
       <option value="22">22</option> 
       <option value="23">23</option> 
       <option value="24">24</option> 
       <option value="25">25</option> 

       </select> 
       <br><br/>     
       <label> What size plants are you starting with ? </label> 

       <label class='radiolabel'><input type="radio" name="plantType" value="16" onclick="getSquareInches(); calculateSquareFeet();" />Seeds, havn't started yet</label><br/> 
       <label class='radiolabel'><input type="radio" name="plantType" value="16" onclick="getSquareInches(); calculateSquareFeet();" /> Seedlings, less than 2ft high</label><br/> 
       <label class='radiolabel'><input type="radio" name="plantType" value="64" onclick="getSquareInches(); calculateSquareFeet();" /> Juvenile, 2 - 4ft high</label><br/> 
       <label class='radiolabel'><input type="radio" name="plantType" value="144" onclick="getSquareInches(); calculateSquareFeet();" /> Adult, 4ft or higher</label><br/> 
       <br/> 
       <label > Grow Type </label> 

       <select id="Grow_Type" name='Grow_Type' onchange="getGrowType();"> 
       <option value="None">Select Grow Type</option> 
       <option value="15">Traditional soil based</option> 
       <option value="21">Hydroponic</option> 
       <option value="None"> Undecided</option> 

       </select> 
       <br><br/> 
       <label > Choose Set-up </label> 

       <label class='radiolabel'><input type="radio" name="SetUp" value="our" onclick="areaTimesType(); getSetUp(); calculateTotal();" />Our Grow Set Up</label><br/> 
       <label class='radiolabel'><input type="radio" name="SetUp" value="your" onclick="areaTimesType(); getSetUp(); calculateTotal();" />Your Grow Set Up</label><br/> 


       <div id="totalPrice"> 
       <!-- <input type="button" id="myButton" name="totalButton" value="Calculate" onclick="claculateTotal();"> --> 
       </div> 

       </fieldset> 
      </div> 


     </form> 
    </div><!--End of wrap--> 

</body> 
</html> 

JS:

var num_plant= new Array(); 
    num_plant ["none"] = 0; 
    num_plant [1] = 1; 
    num_plant [2] = 2; 
    num_plant [3] = 3; 
    num_plant [4] = 4; 
    num_plant [5] = 5; 
    num_plant [6] = 6; 
    num_plant [7] = 7; 
    num_plant [8] = 8; 
    num_plant [9] = 9; 
    num_plant [10] = 10; 
    num_plant [11] = 11; 
    num_plant [12] = 12; 
    num_plant [13] = 13; 
    num_plant [14] = 14; 
    num_plant [15] = 15; 
    num_plant [16] = 16; 
    num_plant [17] = 17; 
    num_plant [18] = 18; 
    num_plant [19] = 19; 
    num_plant [20] = 20; 
    num_plant [21] = 21; 
    num_plant [22] = 22; 
    num_plant [23] = 23; 
    num_plant [24] = 24; 
    num_plant [25] = 25; 


var square_inches = new Array(); 
    square_inches ["seeds"]=16; 
    square_inches ["seedlings"]=16; 
    square_inches ["juveniles"]=64; 
    square_inches ["adult"]=144; 

var type_grow = new Array(); 
    type_grow ["select"] =0; 
    type_grow ["traditional"] =15; 
    type_grow ["hydroponic"] =21; 
    type_grow ["undecided"] =0; 

var set_up = new Array(); 
    set_up ["our"] =10; 
    set_up ["your"] =5; 


function getNumberOfPlants() 
{ 
    var userNumberChoice=0;  
    var theForm = document.forms["sqfoot"];  
    var selectedPlantNum = theForm.elements["plantNumber"];  
    userNumberChoice = num_plant[selectedPlantNum.value];  
    return userNumberChoice;  
} 

function getSquareInches() 
{ 
    var thePlantSize=0;  
    var theForm = document.forms["sqfoot"];  
    var selectedPlant = theForm.elements["plantType"];  
    for(var i = 0; i < selectedPlant.length; i++) 
    {   
     if(selectedPlant[i].checked) 
     {   
      thePlantSize = square_inches[selectedPlant[i].value];    
      break; 
     } 
    }  
    return thePlantSize; 
} 

function calculateSquareFeet() 
{ 
    return (getNumberOfPlants() * getSquareInches())/144;  
} 

function getGrowType() 
{ 
    var userGrowChoice=0;  
    var theForm = document.forms["sqfoot"];  
    var selectedGrowType = theForm.elements["Grow_Type"];  
    userGrowChoice = type_grow[selectedGrowType.value];  
    return userGrowChoice; 
} 

function areaTimesType() 
{ 
    return calculateSquareFeet() * getGrowType(); 
} 

function getSetUp() 
{ 
    var theSetUpChoice=0;  
    var theForm = document.forms["sqfoot"];  
    var selectedSetUp = theForm.elements["SetUp"];  
    for(var j = 0; j < selectedSetUp.length; j++) 
    {   
     if(selectedSetUp[j].checked) 
     {    
      theSetUpChoice = set_up[selectedSetUp[j].value];    
      break; 
     } 
    }  
    return theSetUpChoice; 
} 

function calculateTotal() 
{  
    var theWholeThing = areaTimesType() + getSetUp();  
    var divobj = document.getElementById('totalPrice'); 
    divobj.style.display='block'; 
    divobj.innerHTML = "Total Price For grow space $"+theWholeThing; 
} 
+1

給我們一個暗示:該功能(S)正在返回'undefined'? –

+0

你有一個html錯誤,我想你的問題:'