Warum greift meine Funktion nicht auf die Werte aus einem leeren Eingabefeld und führt die Funktion korrekt aus?

-1

In meinem Programm schrieb ich mehrere Funktionen, so dass, wenn Sie eine beliebige Anzahl von Tickethaltern und ergänzenden Pässen von 1 bis 550 getippt haben, und nachdem Sie auf den Button "Verfügbare Plätze berechnen" geklickt haben, würde Folgendes angezeigt: "The Anzahl der verfügbaren Plätze ist "und dann 555 minus die Anzahl der Karteninhaber und Zusatzkarten. Mit meinem aktuellen Code, wenn ich mit den zwei leeren Feldern mit zwei Zufallszahlen fertig bin und dann auf den Button "Verfügbare Plätze berechnen" klicke, wird immer "Die Anzahl der verfügbaren Plätze ist 555" angezeigt. Ich möchte das Programm zunächst die beiden Werte von Ticketinhaber subtrahieren und geht von 555 (die maximale Anzahl der Sitze auf dieser Ebene) und diesen Wert anzuzeigen, nicht nur 555.Warum greift meine Funktion nicht auf die Werte aus einem leeren Eingabefeld und führt die Funktion korrekt aus?

var TicketHolders = parseInt(document.getElementById("txtTickets").value) || 0; 
 
    var ComplementaryPasses = parseInt(document.getElementById("txtPasses").value) || 0; 
 
    
 
    function number_of_available_seats(TicketHolders, ComplementaryPasses) { 
 
     var answer = 555 - (TicketHolders + ComplementaryPasses); 
 
    \t return("The number of available seats is " + answer); 
 
    } 
 
    var button = document.getElementById("btnSubmit"); 
 
    
 
    
 
    
 
    function showresults(TicketHolders, ComplementaryPasses) { 
 
    \t document.getElementById("results").innerHTML = number_of_available_seats(TicketHolders, ComplementaryPasses); 
 
    } 
 
    
 
    function clickonbutton(){ 
 
    showresults(TicketHolders, ComplementaryPasses); 
 
    } 
 
    
 
    button.onclick = function() { 
 
    clickonbutton(); 
 
    };

<!-- airbus.html --> 
 
    <html lang="en"> 
 
    <head> 
 
     <meta charset="utf-8"> 
 
     <title>Airbus Seat Calculator</title> 
 
    <style> 
 
    DIV.movable { position:absolute;} 
 
    </style> 
 
    
 
    </head> 
 
     
 
    <body> 
 
    
 
     <h2>Airbus Seat Calculator</h2> 
 
     
 
     <form id="formTest" method="get" action="processData"> 
 
     <table> 
 
     
 
     <tr> 
 
      <td><label for="txtTickets">Ticket Holders<span class="inputs"></span></label></td> 
 
      <td><input type="text" id="txtTickets" name="tickets"></td> 
 
     </tr> 
 
     <tr> 
 
      <td><label for="txtPasses">Complementary Passes<span class="inputs"></span></label></td> 
 
      <td><input type="text" id="txtPasses" name="passes"></td> 
 
     </tr> 
 
     
 
     
 
     <tr> 
 
      <td>&nbsp;</td> 
 
      <td> 
 
       <input type="button" value="Calculate Available Seats" id="btnSubmit"></td> 
 
     </tr> 
 
     </table> 
 
     </form> 
 
    
 
    <div id="results"> \t 
 
    </div> 
 
    <h2>Your Copyright Info Goes Here</h2> 
 
    <script src="airbus.js"> 
 
    
 
    
 
    </script> 
 
    
 
    </body> 
 
    </html>

Quelle

2016-07-27 user_13439903

Sie haben:

var TicketHolders = parseInt(document.getElementById("txtTickets").value) || 0; 
var ComplementaryPasses = parseInt(document.getElementById("txtPasses").value) || 0;

an der Spitze Ihres Skripts. Es wird nur einmal aufgerufen, daher wird es nur einmal berechnet (beim Laden der Seite). Bewegen Sie es einfach in die Funktion clickonbutton nach unten, sehen Sie die Werte erhalten, wenn die Schaltfläche geklickt wird:

function number_of_available_seats(TicketHolders, ComplementaryPasses) { 
 
     var answer = 555 - (TicketHolders + ComplementaryPasses); 
 
    \t return("The number of available seats is " + answer); 
 
    } 
 
    var button = document.getElementById("btnSubmit"); 
 
    
 
    
 
    
 
    function showresults(TicketHolders, ComplementaryPasses) { 
 
    \t document.getElementById("results").innerHTML = number_of_available_seats(TicketHolders, ComplementaryPasses); 
 
    } 
 
    
 
    function clickonbutton(){ 
 
     var TicketHolders = parseInt(document.getElementById("txtTickets").value) || 0; 
 
    var ComplementaryPasses = parseInt(document.getElementById("txtPasses").value) || 0; 
 
    showresults(TicketHolders, ComplementaryPasses); 
 
    } 
 
    
 
    button.onclick = function() { 
 
    clickonbutton(); 
 
    };

<!-- airbus.html --> 
 
    <html lang="en"> 
 
    <head> 
 
     <meta charset="utf-8"> 
 
     <title>Airbus Seat Calculator</title> 
 
    <style> 
 
    DIV.movable { position:absolute;} 
 
    </style> 
 
    
 
    </head> 
 
     
 
    <body> 
 
    
 
     <h2>Airbus Seat Calculator</h2> 
 
     
 
     <form id="formTest" method="get" action="processData"> 
 
     <table> 
 
     
 
     <tr> 
 
      <td><label for="txtTickets">Ticket Holders<span class="inputs"></span></label></td> 
 
      <td><input type="text" id="txtTickets" name="tickets"></td> 
 
     </tr> 
 
     <tr> 
 
      <td><label for="txtPasses">Complementary Passes<span class="inputs"></span></label></td> 
 
      <td><input type="text" id="txtPasses" name="passes"></td> 
 
     </tr> 
 
     
 
     
 
     <tr> 
 
      <td>&nbsp;</td> 
 
      <td> 
 
       <input type="button" value="Calculate Available Seats" id="btnSubmit"></td> 
 
     </tr> 
 
     </table> 
 
     </form> 
 
    
 
    <div id="results"> \t 
 
    </div> 
 
    <h2>Your Copyright Info Goes Here</h2> 
 
    
 
    </script> 
 
    
 
    </body> 
 
    </html>

Quelle

2016-07-27 22:55:17 FrankerZ

Warum greift meine Funktion nicht auf die Werte aus einem leeren Eingabefeld und führt die Funktion korrekt aus?

Antwort

Verwandte Themen