Ich habe eine Alterskalibrator und ich muss aktualisieren, um wieder zu verwenden

Question

Ich bin neu in Java-Skript und war herumalbern mit einem Altersrechner. Ich habe einen gemacht, der gut funktioniert, aber mir ist aufgefallen, dass Sie die Seite aktualisieren müssen, um sie wieder zu verwenden. Wie könnte ich es so machen, dass du dich nicht auffrischen musst und alles, was du tun musstest, war einen anderen Wert einzugeben?

<table id="tableCenter"> 
     <tr id="yearBornRow"> 
      <p>What year were they born?</p> 
      <input id="yearBorn"> 
     </tr> 
     <tr id="currentYearRow"> 
      <p>What is the current year?</p> 
      <input id="currentYear"> 
     </tr> 
    </table> 

    <br> 

    <button onclick="showAge()">Submit</button> 

    <p id="printCurrentAge">Submit to find the age!</p> 

und dann die js

<script> 
     var yearBorn = document.getElementById("yearBorn").value 

     var currentYear = document.getElementById("currentYear").value 

     var age = currentYear - yearBorn 

     var possiblity = age++ 

     function showAge(){ 
      document.getElementById("printCurrentAge").innerHTML = "The person is either " +possiblity+ " or " +age; 
     } 
    </script> 

Danke für jede Hilfe in fortgeschrittenen

Answer 1

Da Sie Arithmetik mit Ihren Werten durchführen, müssen Sie richtig, sie als ganze Zahlen analysieren, damit Sie sie verwenden können, über die parseInt() Funktion:

var yearBorn = parseInt(document.getElementById("yearBorn").value); 
var currentYear = parseInt(document.getElementById("currentYear").value); 
var age = currentYear - yearBorn 
var possiblity = age + 1; 

Sie wollen auch t hinzufügen seine in Ihrer showAge() Funktion, so dass es jedes Mal auf die Schaltfläche geklickt wird, berechnet wird:

function showAge(){ 
     var yearBorn = parseInt(document.getElementById("yearBorn").value); 
     var currentYear = parseInt(document.getElementById("currentYear").value); 
     var age = currentYear - yearBorn 
     var possiblity = age + 1; 
     document.getElementById("printCurrentAge").innerHTML = "The person is either " +possiblity+ " or " +age; 
} 

Answer 2

Sie müssen nur Ihre Variablen in Funktion bewegen. Es wird wie ein Charme funktionieren! Gehen Sie wie folgt vor:

<script> 


    function showAge(){ 
     var yearBorn = document.getElementById("yearBorn").value 

     var currentYear = document.getElementById("currentYear").value 

     var age = currentYear - yearBorn 

     var possiblity = age++ 

     document.getElementById("printCurrentAge").innerHTML = "The person is either " +possiblity+ " or " +age; 
    } 
</script>