Wie man JS zwingt, Mathe zu machen, anstatt zwei Strings zusammenzufügen


102

Ich benötige Javascript, um einer ganzzahligen Variablen 5 hinzuzufügen, aber stattdessen behandelt es die Variable als Zeichenfolge, schreibt die Variable aus und fügt dann 5 am Ende der "Zeichenfolge" hinzu. Wie kann ich es zwingen, stattdessen zu rechnen?

var dots = document.getElementById("txt").value; // 5
function increase(){
    dots = dots + 5;
}

Ausgabe: 55

Wie kann ich die Ausgabe erzwingen 10?


3
Dieses spezielle Beispiel gibt 10 aus.
Täuschung


10
Sie haben diejenigen, die Ihnen helfen möchten, übermäßig belastet, indem Sie Ihren gesamten Code ausgegeben haben, ohne zu versuchen, ihn zu reduzieren. Testen Sie es selbst ... machen die CSS-Attribute #controleinen Unterschied bei Ihrem Problem? Wenn nicht, löschen Sie sie und zeigen Sie sie uns nicht. Reduzieren Sie Ihren Code weiter, bis Sie den absoluten Mindesttestfall haben, der zur Reproduktion Ihres Problems erforderlich ist. In den meisten Fällen finden Sie das Problem und lernen dabei. Wenn Sie es nicht selbst lösen, erhalten Sie sehr wahrscheinlich schnelle Hilfe bei Ihrem einfachen Beispiel.
Phrogz

Antworten:


108

Du hast die Leitung

dots = document.getElementById("txt").value;

In Ihrer Datei werden Punkte als Zeichenfolge festgelegt, da der Inhalt von txt nicht auf eine Zahl beschränkt ist.

Um es in ein Int umzuwandeln, ändern Sie die Zeile in:

dots = parseInt(document.getElementById("txt").value, 10);

Hinweis: 10Hier wird die Dezimalzahl (Basis-10) angegeben. Ohne dies interpretieren einige Browser die Zeichenfolge möglicherweise nicht richtig. Siehe MDN : parseInt.


3
Verknüpfung ... dots = + document.getElementById ("txt"). value
Tracker1

5
parseInt (..., 10) auch immer einen Radix verwenden ... eine Überprüfung der geistigen Gesundheit ... wenn (! Punkte || Punkte <1) auch in Ordnung sein können ...
Tracker1

1
Verwenden Sie besser den Inkrement-Operator für Addition. wie VARIABLE ++ anstelle von VAR = VAR + 1;
Gnganpath

52

das einfachste:

dots = dots*1+5;

Die Punkte werden in Zahlen umgewandelt.


33
Noch einfacher als das wäre dots = +dots+5.
Andy E


9

Ich füge diese Antwort hinzu, weil ich sie hier nicht sehe.

Eine Möglichkeit besteht darin, ein '+' vor den Wert zu setzen

Beispiel:

var x = +'11.5' + +'3.5'

x === 15

Ich habe festgestellt, dass dies der einfachste Weg ist

In diesem Fall lautet die Zeile:

dots = document.getElementById("txt").value;

könnte geändert werden zu

dots = +(document.getElementById("txt").value);

um es auf eine Zahl zu zwingen

HINWEIS:

+'' === 0
+[] === 0
+[5] === 5
+['5'] === 5

8

parseInt() sollte den Trick machen

var number = "25";
var sum = parseInt(number, 10) + 10;
var pin = number + 10;

Gibt Ihnen

sum == 35
pin == "2510"

http://www.w3schools.com/jsref/jsref_parseint.asp

Hinweis: Das 10in parseInt(number, 10)gibt die Dezimalstelle (Basis-10) an. Ohne dies interpretieren einige Browser die Zeichenfolge möglicherweise nicht richtig. Siehe MDN : parseInt.



1

Es ist wirklich einfach

var total = (1 * yourFirstVariablehere) + (1 * yourSecondVariablehere)

Dies zwingt Javascript zur Multiplikation, da es keine Verwirrung gibt, wenn * Javascript anmeldet.


1

Sie können + hinter der Variablen hinzufügen, wodurch eine Ganzzahl erzwungen wird

var dots = 5
    function increase(){
        dots = +dots + 5;
    }

1

Nachdem ich die meisten Antworten hier ohne Erfolg für meinen speziellen Fall ausprobiert hatte, kam ich auf Folgendes:

dots = -(-dots - 5);

Die + -Zeichen verwirren js, und dies beseitigt sie vollständig. Einfach zu implementieren, wenn möglicherweise verwirrend zu verstehen.


-3

AKTUALISIERT seit dem letzten Downvoting ....

Ich habe nur die Portion gesehen

var dots = 5
function increase(){
    dots = dots+5;
}

vorher, aber es wurde mir später gezeigt, dass die txtBox die Variable füttert dots. Aus diesem Grund müssen Sie sicherstellen, dass die Eingabe "bereinigt" wird, um sicherzustellen, dass sie nur Ganzzahlen und keinen schädlichen Code enthält.

Eine einfache Möglichkeit, dies zu tun, besteht darin, das Textfeld mit einem onkeyup()Ereignis zu analysieren, um sicherzustellen, dass es numerische Zeichen enthält:

<input size="40" id="txt" value="Write a character here!" onkeyup="GetChar (event);"/>

Dabei würde das Ereignis einen Fehler auslösen und das letzte Zeichen löschen, wenn der Wert keine Zahl ist:

<script type="text/javascript">
    function GetChar (event){
        var keyCode = ('which' in event) ? event.which : event.keyCode;
        var yourChar = String.fromCharCode();
        if (yourChar != "0" &&
            yourChar != "1" &&
            yourChar != "2" &&
            yourChar != "3" && 
            yourChar != "4" &&
            yourChar != "5" &&
            yourChar != "6" && 
            yourChar != "7" &&
            yourChar != "8" && 
            yourChar != "9")
        {
            alert ('The character was not a number');
            var source = event.target || event.srcElement;
            source.value = source.value.substring(0,source.value-2);
        }
    }
</script>

Natürlich könnte man das auch mit Regex machen, aber ich habe den faulen Ausweg gewählt.

Da Sie dann wissen würden, dass nur Zahlen in der Box sein könnten, sollten Sie in der Lage sein, nur zu verwenden eval():

dots = eval(dots) + 5;

2
eval()ist gefährlich, wenn dotses sich um Benutzereingaben handelt, insbesondere wenn es sich um gespeicherte Eingaben handelt. Weitere Informationen
Chad Levy

@ChadLevy Vielen Dank für den Link - eine gute Lektüre - und das Aufrufen, aber in diesem Fall war das Problem nicht gerechtfertigt, da es nicht von Benutzereingaben stammte. dotswar eine definierte Variable, die inkrementiert und nur mit einer Zeichenfolge verwechselt wurde. Daher qualifiziere ich meine Antwort, dass sie, wie Sie sagten, nicht leichtfertig von Benutzern / gespeicherten Eingaben verwendet werden sollte, die das Potenzial für eine böse Skriptinjektion haben könnten. Aber auch in diesem Fall würde eine solche Injektion ohnehin einen mathematischen Fehler / eine mathematische Ausnahme verursachen, sodass sie in keiner Weise wirklich etwas bewirken würde.
Vapcguy

Für diejenigen, die Downvoting betreiben, weil Sie dies für eval()so gefährlich halten, müssen Sie sich den Code in dem Kontext ansehen, den das OP verwendet hat. Dies liegt in diesem Fall nicht daran, dass er Eingaben verwendet, die nicht aus einem Textfeld oder einer anderen Form der Benutzereingabe stammen, bei der möglicherweise ein nicht numerischer Wert injiziert wird! Ich wünschte, ich könnte Ihre Abstimmungen ablehnen!
Vapcguy

Ein weiterer Downvoter. Möchtest du dich erklären, anstatt nur ein Schaf zu sein? Es gibt Zeiten, in denen eval()es in Ordnung ist, und Sie müssen sich den Kontext ansehen, in dem es verwendet wird, anstatt blindlings alles zu glauben, was Sie lesen, ohne es wirklich zu verstehen!
Vapcguy

1
@ChadLevy Ok, in dieser Hinsicht hast du recht. Ich habe mir diesen Abschnitt nicht angesehen - ich habe mich auf das konzentriert, was er oben auf der Seite eingefügt hat: Der Code var dots = 5 function increase(){ dots = dots+5; }verwendet kein Textfeld und weist direkte Variablen zu, nicht aus Benutzereingaben. Das ist es, was ich gemacht habe. Aber ich sah , du hast recht , dass er das Textfeld ist die Zuordnung txtzu dots, und dotsist eine globale Variable, und so wird von dieser Eingabe aktualisiert. Du hast recht. Vielen Dank.
Vapcguy
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.