javascript - Toegevoegd aan het toevoegen van twee nummers aaneengeert hen in plaats van het berekenen van de som

Ik voeg twee nummers toe, maar ik krijg geen juiste waarde.

Doet bijvoorbeeld 1 + 2retourneert 12 en niet 3

Wat doe ik verkeerd in deze code?

function myFunction() {
  var y = document.getElementById("txt1").value;
  var z = document.getElementById("txt2").value;
  var x = y + z;
  document.getElementById("demo").innerHTML = x;
}

<p>
  Click the button to calculate x.
  <button onclick="myFunction()">Try it</button>
</p>
<p>
  Enter first number:
  <input type="text" id="txt1" name="text1" value="1">
  Enter second number:
  <input type="text" id="txt2" name="text2" value="2">
</p>
<p id="demo"></p>

Antwoord 1, Autoriteit 100%

ze zijn eigenlijk strijkers, geen cijfers. De eenvoudigste manier om een getal uit een string te produceren, is om het te produceren met +:

var x = +y + +z;

Antwoord 2, Autoriteit 38%

Ik gebruik gewoon Number():

var i=2;  
var j=3;  
var k = Number(i) + Number(j); // 5

Antwoord 3, Autoriteit 8%

U moet JavaScript’s parseInt()-methode gebruiken om de snaren weer in cijfers te draaien. Op dit moment zijn ze snaren, dus het toevoegen van twee snaren voegt ze aan, daarom krijg je “12”.

Antwoord 4, Autoriteit 6%

Gebruik parseint (…) , maar zorg ervoor dat u een radixwaarde opgeeft; Anders krijg je verschillende bugs (als de string begint met “0”, is de Radix Octal / 8 enz.).

var x = parseInt(stringValueX, 10);
var y = parseInt(stringValueY, 10);
alert(x + y);

Ik hoop dat dit helpt!

Antwoord 5, Autoriteit 3%

Het volgende kan handig zijn in algemene voorwaarden.

EERSTE, HTML-formuliervelden zijn beperkt tot Tekst . Dat is vooral van toepassing op tekstvakken, zelfs als u pijn hebt gedaan om ervoor te zorgen dat de waarde als een getal uitziet.
Ten tweede, JavaScript, voor beter of slechter, heeft de +bediener met twee betekenissen overbelast: het voegt nummers toe, en het concateneert snaren. Het heeft een voorkeur voor aaneenschakeling, dus zelfs een expressie zoals 3+'4'zal als aaneenschakeling worden behandeld.
Derde, JavaScript zal proberen typen dynamisch te wijzigen als het kan, en als het nodig heeft. Bijvoorbeeld '2'*'3'zal beide typen in cijfers veranderen, omdat u de snaren niet kunt vermenigvuldigen. Als een van hen incompatibel is, krijgt u NaN, geen nummer.

Uw probleem treedt op omdat de gegevens uit het formulier worden beschouwd als een tekenreeks en de +zal daarom in plaats van toevoegen.

Bij het lezen van vermoedelijk numerieke gegevens van een formulier moet u deze altijd doorgaan met parseInt()of parseFloat(), afhankelijk van of u een integer of een decimaal wilt .

Merk op dat geen van beide functies een tekenreeks echt converteertnaar een getal. In plaats daarvan zal het de tekenreeks van links naar rechts ontleden totdat het een ongeldig numeriek teken of het einde bereikt en converteren wat is geaccepteerd. In het geval van parseFloatbevat dat één decimaal, maar niet twee.

Alles na het geldige nummer wordt gewoon genegeerd. Ze falen allebei als de string niet eens als een nummer begint. Dan krijg je NaN.

Een goede techniek voor algemene doeleinden voor getallen uit formulieren is zoiets als dit:

var data=parseInt(form.elements['data'].value); //  or parseFloat

Als u bereid bent een ongeldige tekenreeks samen te voegen tot 0, kunt u het volgende gebruiken:

var data=parseInt(form.elements['data'].value) || 0;

Antwoord 6, autoriteit 2%

Voeg gewoon een eenvoudige type-castmethode toe, aangezien de invoer in tekst wordt genomen. Gebruik het volgende:

   var y = parseInt(document.getElementById("txt1").value);
    var z = parseInt(document.getElementById("txt2").value);
    var x = y + z;

Antwoord 7, autoriteit 2%

Dit vat het aantal niet samen; in plaats daarvan zal het het samenvoegen:

var x = y + z;

Je moet het volgende doen:

var x = (y)+(z);

U moet parseInt gebruiken om de bewerking op getallen te specificeren. Voorbeeld:

var x = parseInt(y) + parseInt(z); [final soulution, as everything us]

Antwoord 8

Eenvoudig

var result = parseInt("1") + parseInt("2");
console.log(result ); // Outputs 3

Antwoord 9

Deze code somt beide variabelen op! Zet het in je functie

var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var x = (y +z);
document.getElementById("demo").innerHTML = x;`

Antwoord 10

Of je kunt gewoon initialiseren

var x = 0; (je moet let x = 0 gebruiken;)

Op deze manier voegt het niet samen.

Antwoord 11

Je mist de typeconversie tijdens de toevoegingsstap…
var x = y + z;moet var x = parseInt(y) + parseInt(z);

zijn

<!DOCTYPE html>
 <html>
 <body>
  <p>Click the button to calculate x.</p>
  <button onclick="myFunction()">Try it</button>
  <br/>
  <br/>Enter first number:
  <input type="text" id="txt1" name="text1">Enter second number:
  <input type="text" id="txt2" name="text2">
  <p id="demo"></p>
 <script>
    function myFunction() 
    {
      var y = document.getElementById("txt1").value;
      var z = document.getElementById("txt2").value;
      var x = parseInt(y) + parseInt(z);
      document.getElementById("demo").innerHTML = x;
    }
 </script>
 </body>
 </html>

Antwoord 12

 <input type="text" name="num1" id="num1" onkeyup="sum()">
  <input type="text" name="num2" id="num2" onkeyup="sum()">
  <input type="text" name="num2" id="result">
  <script>
     function sum()
     {
        var number1 = document.getElementById('num1').value;
        var number2 = document.getElementById('num2').value;
        if (number1 == '') {
           number1 = 0
           var num3 = parseInt(number1) + parseInt(number2);
           document.getElementById('result').value = num3;
        }
        else if(number2 == '')
        {
           number2 = 0;
           var num3 = parseInt(number1) + parseInt(number2);
           document.getElementById('result').value = num3;
        }
        else
        {
           var num3 = parseInt(number1) + parseInt(number2);
           document.getElementById('result').value = num3;
        }
     }
  </script>

Antwoord 13

Het is heel eenvoudig:

<html>
    <body>
        <p>Click the button to calculate x.</p>
        <button onclick="myFunction()">Try it</button>
        <br/>
        <br/>Enter first number:
        <input type="text" id="txt1" name="text1">Enter second number:
        <input type="text" id="txt2" name="text2">
        <p id="demo"></p>
        <script>
            function myFunction() {
                var y = document.getElementById("txt1").value;
                var z = document.getElementById("txt2").value;
                var x = +y + +z;
                document.getElementById("demo").innerHTML = x;
            }
        </script>
    </body>
</html>

Antwoord 14

Probeer dit:

<!DOCTYPE html>
<html>
    <body>
        <p>Add Section</p>
        <label>First Number:</label>
        <input id="txt1"  type="text"/><br />
        <label>Second Number:</label>
        <input id="txt2"  type="text"/><br />
        <input type="button" name="Add" value="Add" onclick="addTwoNumber()"/>
        <p id="demo"></p>
        <script>
            function myFunction() {
                document.getElementById("demo").innerHTML = Date();
            }
            function addTwoNumber(){
                var a = document.getElementById("txt1").value;
                var b = document.getElementById("txt2").value;
                var x = Number(a) + Number(b);
                document.getElementById("demo").innerHTML = "Add Value: " + x;
            }
        </script>
    </body>
</html>

Antwoord 15

   <head>
        <script type="text/javascript">
            function addition()
            {
                var a = parseInt(form.input1.value);
                var b = parseInt(form.input2.value);
                var c = a+b
                document.write(c);
            }
        </script>
    </head>
    <body>
        <form name="form" method="GET">
        <input type="text" name="input1" value=20><br>
        <input type="text" name="input2" value=10><br>
        <input type="button" value="ADD" onclick="addition()">
        </form>
    </body>
</html>

Antwoord 16

Als we twee invoervelden hebben, haal dan de waarden uit de invoervelden en voeg ze toe met JavaScript.

$('input[name="yourname"]').keyup(function(event) {
    /* Act on the event */
    var value1 = $(this).val();
    var value2 = $('input[name="secondName"]').val();
    var roundofa = +value2+ +value1;
    $('input[name="total"]').val(addition);
});

Antwoord 17

U kunt een voorcontrole uitvoeren met reguliere expressies, ongeacht of het getallen zijn zoals

function myFunction() {
    var y = document.getElementById("txt1").value;
    var z = document.getElementById("txt2").value;
    if((x.search(/[^0-9]/g) != -1)&&(y.search(/[^0-9]/g) != -1))
      var x = Number(y)+ Number(z);
    else
      alert("invalid values....");
    document.getElementById("demo").innerHTML = x;
  }

Antwoord 18

Gebruik parseFloatom de tekenreeks om te zetten in een getal inclusief decimale waarden.

function myFunction() {
      var y = document.getElementById("txt1").value;
      var z = document.getElementById("txt2").value;
      var x = parseFloat(y) + parseFloat(z);
      document.getElementById("demo").innerHTML = x;
    }

<p>
  Click the button to calculate x.
  <button onclick="myFunction()">Try it</button>
</p>
<p>
  Enter first number:
  <input type="text" id="txt1" name="text1" value="1">
  Enter second number:
  <input type="text" id="txt2" name="text2" value="2">
</p>
<p id="demo"></p>

Antwoord 19

Je kunt ook schrijven:
var z = x – -y;
En je krijgt het juiste antwoord.

<body>
<input type="text" id="number1" name="">
<input type="text" id="number2" name="">
<button type="button" onclick="myFunction()">Submit</button>
<p id="demo"></p>
    <script>
    function myFunction() {
        var x, y ;
        x = document.getElementById('number1').value;
        y = document.getElementById('number2').value;
        var z = x - -y ;
        document.getElementById('demo').innerHTML = z;
    }
    </script>
</body>

Antwoord 20

Hier komt je code door de variabelen in de functie te ontleden.

<html>
  <body>
    <p>Click the button to calculate x.</p>
    <button onclick="myFunction()">Try it</button>
    <br/>
    <br/>Enter first number:
    <input type="text" id="txt1" name="text1">
    <br>Enter second number:
    <input type="text" id="txt2" name="text2">
    <p id="demo"></p>
    <script>
      function myFunction() {
        var y = parseInt(document.getElementById("txt1").value);
        var z = parseInt(document.getElementById("txt2").value);
        var x = y + z;
        document.getElementById("demo").innerHTML = x;
      }
    </script>
  </body>
</html>

Antwoord

Antwoord 21

Als niets werkt, probeer dan alleen dit. Dit is misschien niet de juiste manier om het te doen, maar het werkte voor mij toen al het bovenstaande faalde.

var1 - (- var2)

Antwoord 22

Dit kan ook worden bereikt met een meer native HTML-oplossing door gebruik te maken van de outputelement.

<form oninput="result.value=parseInt(a.valueAsNumber)+parseInt(b.valueAsNumber)">
  <input type="number" id="a" name="a" value="10" /> +
  <input type="number" id="b" name="b" value="50" /> =
  <output name="result" for="a b">60</output>
</form>

https://jsfiddle.net/gxu1rtqL/

Het outputelement kan dienen als een containerelement voor een berekening of uitvoer van de actie van een gebruiker. Je kunt ook het HTML-type wijzigen van numberin rangeen dezelfde code en functionaliteit behouden met een ander UI-element, zoals hieronder weergegeven.

<form oninput="result.value=parseInt(a.valueAsNumber)+parseInt(b.valueAsNumber)">
  <input type="range" id="a" name="a" value="10" /> +
  <input type="number" id="b" name="b" value="50" /> =
  <output name="result" for="a b">60</output>
</form>

https://jsfiddle.net/gxu1rtqL/2/

Antwoord 23

Misschien kunt u deze functie gebruiken om getallen toe te voegen:

function calculate(a, b) {
  return a + b
}
console.log(calculate(5, 6))

Antwoord 24

Een alternatieve oplossing, gewoon delen 🙂 :

var result=eval(num1)+eval(num2);

Previous articleHibernate-eigenschappen niet gevonden

Next articleJava karakter array initializer

Toegevoegd aan het toevoegen van twee nummers aaneengeert hen in plaats van het berekenen van de som