Kann ich eine Texteingabe zurücksetzen, ohne sie zu löschen?

Question

Zunächst einmal vielen Dank für Ihre Hilfe mit meiner vorherigen Frage. Ich habe meinen Code genau so gemacht, wie ich es mit deiner Hilfe machen wollte. Aber jetzt macht es auch etwas, das ich nicht will.

function raceMod() { 
    var race = document.getElementById("race").value; 
    var str = document.getElementById("strScore").value; 

    if (race == "orc") { 
    var orc = { 
     str: 4, 
     dex: 0, 
     con: 0, 
     int: -2, 
     wis: -2, 
     cha: -2 
    } 
    document.getElementById("strScore").value = (parseInt(str) + parseInt(orc.str)) 

    } else if (race == "ore") { 
    var ore = { 
     str: 2, 
     dex: 0, 
     con: 0, 
     int: 0, 
     wis: 2, 
     cha: -2 
    }; 
    document.getElementById("strScore").value = (parseInt(str) + parseInt(ore.str)) 

    } 
} 

Das ist mein Javascript. Ich habe ein Drop-Down-Menü mit möglichen Rassen zur Auswahl. Abhängig von der gewählten Rasse werden verschiedene Variablen erzeugt, die sich auf die Texteingabe auswirken, die dieser Variablen entspricht.

Im Moment gibt der Benutzer eine Zahl in die Texteingabe ein und wählt dann ein Rennen aus. Abhängig von der ausgewählten Rasse wird ein Modifikator zu den Zahlen addiert oder subtrahiert, die der Benutzer bereits eingegeben hat.

Das Problem, das ich habe, ist, dass das Skript weiterhin zur Eingabe hinzugefügt wird, auch wenn es bereits geändert wurde.

Zum Beispiel wenn der Benutzer "10" in den Eingang eingibt und Ork auswählt, wird die 10 in eine 14 umgewandelt. Aber wenn er einen Oread ("ore") auswählt, ändert sich der Eingang auf 16. Ich brauche es ändere zu 12. Im Wesentlichen brauche ich das Javascript, um die neue Nummer zu ignorieren und die Variable nur der ursprünglichen Eingabe hinzuzufügen.

Gibt es trotzdem etwas zu tun?

Answer 1

Sie können die Eingabe des Benutzers im strScore Eingang erfassen und diesen Wert speichern.

Wenn Sie die Bewertung neu berechnen, wenn sich die race ändert, verwenden Sie den Wert, den der Benutzer eingegeben hat, und nicht den Wert, der sich im strScore-Eingang befindet. Seit dem strScore Wert ändert sich ständig, wenn Sie race ändern.

Hier ist eine Zusammenfassung des Codes (nicht vollständig, siehe Geige)

// the score the user filled in, defaults null 
var userScore = 0; 

// when the user inputs a score, save it 
score.addEventListener('input', function(e) { 
    userScore = e.target.value; 
}); 

function raceMod() { 
     // we only need the race value here 
    var race = raceSelector.value; 

    if (race == "orc") { 
     var orc = { 
      str: 4, 
      dex: 0, 
      con: 0, 
      int: -2, 
      wis: -2, 
      cha: -2 
     }; 

     // this is edited 
     // use the value of `userScore`, not the value from the input 
     score.value = (parseInt(userScore, 10) + parseInt(orc.str, 10)); 


    } else if (race == "ore") { 
     var ore = { 
      str: 2, 
      dex: 0, 
      con: 0, 
      int: 0, 
      wis: 2, 
      cha: -2 
     }; 

     // same as above 
     score.value = (parseInt(userScore, 10) + parseInt(ore.str, 10)); 
    } 
} 

Fiddle: https://jsfiddle.net/pn8nm9js/2/