Operationen auf Javascript Array-Element

Question

Mit dem folgenden Code, in der Funktion placeOrder() kann ich nicht die Berechnungen mit den Preis [] -Array-Elemente und die ChairAmtA (und die folgenden Betragsvariablen, die ich habe) arbeiten. Es gibt immer die Antwort als NaN zurück. Was stimmt nicht mit dem Code und wie behebe ich ihn?

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

Answer 1

Sieht aus wie youre zwei Strings zu subtrahieren versuchen:

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

Sie müssen alle Eingänge konvertieren (sie Strings) sind in Zahlen:

val=input.value.toNumber(); 

Oder:

val = (+ Eingabe.Wert);