2017-11-15 1 views
-2

JavaScript Berechnung?

function Submit() { 
 
var city=0; 
 
    if (document.getElementById("louis").checked){ 
 
     city=40; 
 
    } 
 
    else if (document.getElementById("milwaukee").checked){ 
 
    city=20; 
 
    } 
 
    else if (document.getElementById("detroit").cheked){ 
 
    city=35; 
 
    } 
 

 
var hotel=0; 
 
    if (document.getElementById("economy").checked){ 
 
     hotel=50; 
 
    } 
 
    else if (document.getElementById("standard").checked){ 
 
    hotel=70; 
 
    } 
 
    else if (document.getElementById("upscale").cheked){ 
 
    hotel=120; 
 
    } 
 

 
var numtravelers = parseInt(document.getElementById("travelers").value); 
 

 
var daystravel = parseInt(document.getElementById("day").value); 
 
var mealchoice=0; 
 
    if (document.getElementById("none").checked){ 
 
     mealchoice=0; 
 
    } 
 
    else if (document.getElementById("snack").checked){ 
 
    mealchoice=5; 
 
    } 
 
    else if (document.getElementById("fullmeal").cheked){ 
 
    mealchoice=10; 
 
    } 
 

 

 
var extra=0; 
 
    if (document.getElementById("Wifi").checked){ 
 
     extra=10; 
 
    } 
 
    else if (document.getElementById("recline").checked){ 
 
    extra=20; 
 
    } 
 

 

 
var cost=0; 
 

 

 

 
cost=(city*numtravelers)+(hotel*daystravel)+(numtravelers*mealchoice)+(numtravelers*extra); 
 
document.getElementById("OutputResult").innerHTML="your total cost is $" + cost.toString(); 
 

 

 

 

 

 

 
}
body 
 
{background-color: #000080; 
 
color: #C0C0C0;} 
 
a { 
 
    color: #00ffff; 
 
    border-style: solid; 
 
    border-color: #00ff00; 
 
} 
 

 
form {color: #00ffff; 
 

 

 
} 
 

 
h1 {font-style: italic; 
 
    text-align: center; 
 
    color: #FFD700; 
 
    font-family: Helvetica; 
 
    border-style: solid; 
 
    border-style: solid; 
 
    border-color: gold; 
 
} 
 

 
footer { 
 
font-style: italic; 
 
font-family: cursive; 
 
text-align: center; 
 
color: #FFFFFF; 
 

 

 
} 
 

 
#contact { 
 
    text-align: center; 
 

 
}
<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <meta charset="utf-8"> 
 
    <title>Make a Reservation</title> 
 
<script type="text/javascript" src="reservation_javascript.js"></script> 
 
<link rel="stylesheet" type="text/css" href="final_project_css.css"> 
 
    </head> 
 
    <body> 
 

 
    <div id="nav"> 
 
     <nav> 
 
      <a href="reservation.htm">Make a Reservation</a> 
 
      <a href="contact.htm">Contact Us</a> 
 
      <a href="mailing.htm">Join Our Mailing List</a> 
 
      <a href="busline_home.htm">Home</a> 
 
     </nav> 
 
    </div> 
 
<div> <h1> Mad Men Bus Company </h1> </div> 
 

 
     <form name="reservation"> 
 
      <p>First Name: <input type="text"></p> 
 
      <p>Last Name: <input type="text"></p> 
 

 
     <p>Arrival City:</p> 
 
      St. Louis($40)<input type="radio" name="Arrival" id="louis" value="40"/><br> 
 
      Milwaukee($20)<input type="radio" name="Arrival" id="milwaukee" value="20"/><br> 
 
      Detroit($35)<input type="radio" name="Arrival" id="detroit" value="35"/><br> 
 

 

 
     <p>Hotel Choice:</p> 
 
      Economy($50/day)<input type="radio" name="Hotel" id="economy" value="50"/><br> 
 
      Standard($70/day)<input type="radio" name="Hotel" id="standard" value="70"/><br> 
 
      Upscale($120/day)<input type="radio" name="Hotel"id="upscale" value="120"/><br> 
 

 
     <p>Number of Travelers</p> 
 
<select id="travelers"> 
 
      <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> 
 
</select> 
 

 
<p>Number of Days</p> 
 
    <select id="day"> 
 
      <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> 
 
    </select> 
 

 

 
     <p>Extras</p> 
 
      <input type="checkbox" name="extra" id="Wifi" value="10">Wifi<br> 
 
      <input type="checkbox" name="extra" id="recline" value="20">Fully-reclining seat<br> 
 
<div id="Meal"> 
 
     <p>Meal Choice:</p> 
 

 
      None<input type="radio" name="Meal" id="none"/></br> 
 
      Snack($5)<input type="radio" name="Meal" id="snack" value="5"/></br> 
 
      Full Meal($10)<input type="radio" name="Meal" id="fullmeal" value="10"/></br> 
 
</div> 
 

 

 
     <p>Special Requests:</p> 
 
     <input type="text" name="SpecialRequests"/> 
 
<div> 
 

 

 
<br><input type="button" value="Book My Trip" onclick="Submit()"> 
 

 
</div> 
 

 
<h1 id="Total">Total</h1> 
 

 
<div id="OutputResult"> 
 

 
</div> 
 

 
</form> 
 

 
<footer> 
 
100 Manly Avenue New York, New York 10016, 555-555-5555, [email protected] 
 
</footer> 
 

 

 

 
    </body> 
 
</html>

Wenn der Benutzer Wahl Hotel der gehobenen Klasse wählt und oder detroit jede dieser Optionen einen Wert von 0 zurück, wenn ich die Gesamtkosten berechnen klicken Sie auf. Ich habe den richtigen Wert zugewiesen Ich bin verwirrt, warum es nicht den Preis hinzufügt, den ich mit jeder dieser beiden Variablen verknüpfte. Ich denke nicht, dass meine anderen, wenn Aussagen falsch sind ... Kann mir jemand einen Hinweis geben, warum es nicht funktioniert?

+1

'cheked' <- gut es Ihr erstes Problem ... – Shadow

+0

^Sie haben mehrere Orte, an denen Sie "checked" statt "checked" schreiben. In der Codierung ist die Rechtschreibung wichtig. –

Antwort

0

Wenn der Benutzer Wahl Hotel der gehobenen Klasse wählt und oder detroit

Sie checked in diesen beiden Stellen falsch geschrieben haben. In dieser Situation wird chekedundefined zurückgeben, was falsch ist. Deshalb finden Sie eine 0 an Stelle des erwarteten Zahl erhalten

Alles was Sie brauchen, ist fix

else if (document.getElementById("detroit").cheked){ 

und

else if (document.getElementById("upscale").cheked){ 
+1

Wow, ich kann nicht glauben, dass ich so einen Anfängerfehler gemacht habe, ich entschuldige mich. – Kevin