2017-02-15 94 views
-3

使用下面的代碼,在函數placeOrder()中,我無法使用price []數組元素和chairAmtA(以及下面的量變量)獲得計算結果。它總是以NaN的形式返回答案。代碼有什麼問題,我該如何解決它?Javascript陣列元素上的操作

<title> 
Ryan Weiland, Assignment 2 
</title> 


     <!--Load stylesheet--> 
     <link rel="stylesheet" type="text/css" href="assignment2.css"> 

     <!--Load description variables--> 
     <script type="text/javascript" src="script.js" > 
     </script> 

     <script> 



        <!--Initilize variables for calculations--> 
        var chairCost = 50; 
        var deskCost = 150; 
        var rockerCost = 250; 
        var tableCost = 200; 
        var ftstlCost = 75; 

        var fname; 
        var lname; 
        var streetName; 
        var cityName; 
        var state; 
        var zip; 
        var phoneOne; 
        var phoneTwo; 
        var phoneThree; 

        var chairAmt; 
        var deskAmt; 
        var rockerAmt; 
        var tableAmt; 
        var ftstlAmt; 






function orderTotal(){ 


//window.alert("This Function Works"); 



//Personal Information 
var fname = document.items.first.value; 
var lname = document.items.last.value; 
var streetName = document.items.street.value; 
var cityName = document.items.city.value; 
var state = document.items.state.value; 
var zip = document.items.zipCode.value; 
var phoneOne = document.items.pOne.value; 
var phoneTwo = document.items.pTwo.value; 
var phoneThree = document.items.pThree.value; 

//Item Aomount 
chairAmt = document.items.chairs.value; 
deskAmt = document.items.desks.value; 
rockerAmt = document.items.rockers.value; 
tableAmt = document.items.tables.value; 
ftstlAmt = document.items.ftstls.value; 


//Calculations 


       //Chair Total 
        var costChairT = chairAmt*chairCost; 
       //Desk Total 
        var costDeskT = deskAmt*deskCost; 
       //Rocker Total 
        var costRockerT = rockerAmt*rockerCost; 
       //Table Total 
        var costTableT = tableAmt*tableCost; 
       //Footstool Total 
        var costFtstlT = ftstlAmt*ftstlCost; 
       //Overall Total Cost 
        var totalCost = costChairT + costDeskT + costRockerT + costTableT + costFtstlT; 
       //Personal Total 
        var personalTotal = fname + " " + lname + "\n" + streetName + ", \n" + cityName + " " + state + ", \n" + zip + "\nPhone Number: " + phoneOne + "- " + phoneTwo + "- " +phoneThree + "\n"; 
       //New window with everything retrieved 
       window.alert(personalTotal + "Total Cost: $" + totalCost); 
      } 

function placeOrder(chairsAmt, desksAmt, rockersAmt, tablesAmt, ftstlsAmt) { 


//window.alert("placeOrder runs"); 
var order = []; 

//Prices in array 
var prices = [50, //Chair 
150, //Desk 
250, //Rocking Chair 
200, //Table 
75]; //Footstool 


//Personal Information 
order[0] = document.items.first.value; 
order[1] = document.items.last.value; 
order[2] = document.items.street.value; 
order[3] = document.items.city.value; 
order[4] = document.items.state.value; 
order[5] = document.items.zipCode.value; 
order[6] = document.items.pOne.value; 
order[7] = document.items.pTwo.value; 
order[8] = document.items.pThree.value; 

//Item Aomount 
var chairAmtA = document.items.chairs.value; 
var deskAmtA = document.items.desks.value; 
var rockerAmtA = document.items.rockers.value; 
var tableAmtA = document.items.tables.value; 
var ftstlAmtA = document.items.ftstls.value; 




var prices = "Prices\nChair: " + prices[0] + "\nDesk: " + prices[1] + "\nRocking Chair: " + prices[2] + "\nTable: " + prices[3] + "\nFootstool: " + prices[4] + "\n\n"; 



       //Chair Total 
       var chairCostA = chairAmtA * prices[0]; 
       //Desk Total 
       var deskCostA = deskAmtA * prices[1]; 
       //Rocker Total 
       var rockerCostA = rockerAmtA * prices[2]; 
       //Table Total 
       var tableCostA = tableAmtA * prices[3]; 
       //Footstool Total 
       var ftstlCostA = ftstlAmtA * prices[4]; 

       //Overall Total Cost 
       var totalCostA = chairCostA + deskCostA + rockerCostA + tableCostA + ftstlCostA; 

       //Personal Total 
       personalTotalA= order[0] + " " + order[1] + "\n" 
       + order[2] + ", " + order[3] + "\n" 
       + order[4] + ", " + order[5] + "\n" 
       + "Phone Number: " + order[6] + "-" + order[7] + "-" + order[8] + "\n\n"; 


       //Quantity ordered 
       var quantity = "Chairs Ordered: " + chairAmtA + "\nDesks Ordered: " + deskAmtA + "\nRocking Chairs Ordered: " + rockerAmtA + "\nTables Ordered: " + tableAmtA + "\nFootstools Ordered: " + ftstlAmtA + "\n\n"; 

       //New window with everything retrieved 
       var x = window.confirm(personalTotalA + quantity + prices + "\nTotal Cost: $" + totalCostA); 
       if(x ==true) 
        window.alert("Your order has been placed!"); 

       else 
        window.alert("Your order has been cancled."); 

} 
</script> 

<h1>Swanson's Woodworking</h1> 
<h2>Customer Order Form</h2> 
<br /> 

<!--List of items--> 
<form name="items"> 
<br /> 
<br /> 

<!--Chair--> 
Click the button for a description. 
<input type="radio" name="items" onclick="document.item.itemDesc2.value=chairDesc" /> 
<b>Chair($50)</b> 
<br /> 
<!--Desk--> 
Click the button for a description. 
<input type="radio" name="items" onclick="document.item.itemDesc2.value=deskDesc" /> 
<b>Desk($150)</b> 
<br /> 
<!--Rocking Chair--> 
Click the button for a description. 
<input type="radio" name="items" onclick="document.item.itemDesc2.value=rockerDesc" /> 
<b>Rocking Chair($250)</b> 
<br /> 
<!--Table--> 
Click the button for a description. 
<input type="radio" name="items" onclick="document.item.itemDesc2.value=tableDesc" /> 
<b>Table($200)</b> 
<br /> 
<!--Footstool--> 
Click the button for a description. 
<input type="radio" name="items" onclick="document.item.itemDesc2.value=ftstlDesc" /> 
<b>Footstool($75)</b> 
<br /> 
<!--Textarea for descriptions--> 
<p> 
    <textarea name="itemDesc2" cols="30" rows="5" style="background-color: transparent; border: 1; font-size:20px; overflow: hidden; color: #5e0000"> 
    </textarea> 
</p>  


<!--Information Form--> 



<!--Personal Information--> 

First Name: <input type="text" name="first"> 
<br /><br /> 
Last Name : <input type="text" name="last"> 
<br /><br /> 
Street Address:<input type="text" name="street"> 
<br /><br /> 
City: <input type="text" name="city"> 
<br /><br /> 
State: <input type="text" name="state"> 
<br /><br /> 
Zip Code: <input type="text" name="zipCode"> 
<br /><br /> 
Phone Number: (<input type="text" name="pOne" size="3">) - <input type="text" name="pTwo" size="3"> - <input type="text" name="pThree" size="4"> 
<br /><br /> 

<!--List of items--> 
Chairs Desired: <input type="number" name="chairs"> 
<br /><br /> 
Desks Desired: <input type="number" name="desks"> 
<br /><br /> 
Rocking Chairs Desired: <input type="number" name="rockers"> 
<br /><br /> 
Tables Desired: <input type="number" name="tables"> 
<br /><br /> 
Footstools Desired: <input type="number" name="ftstls"> 
<br /><br /> 

</form> 


<!--Calculate your total order.--> 


<input type = "button" onclick = "orderTotal()" value = "Calculate your total order" > <!--Button for total--> 
<br /><br > 
<input type = "button" onclick = "placeOrder()" value = "Place Order" > <!--Button for total--> 

+0

我建議在瀏覽器中使用開發人員工具創建一箇中斷點並逐步完成。 – JoshNaro

回答

0

貌似youre設法減去兩個字符串:

console.log("12"-"13"); 

你需要將所有輸入(它們是字符串),以數字:

val=input.value.toNumber(); 

或者:

VAL =( + input.value);

+0

我不太明白你在這裏的意思。你能再詳細說明一下這應該如何工作嗎? –