¿Cómo puedo hacer que document.getElementById ('id'). Value devuelva un número, no una cadena en Javascript?

Estoy haciendo un formulario para que los usuarios ingresen el número y luego intenten mostrar la sum. Pero el valor document.getElementById('someid').value una cadena. Y, por lo tanto, mi function de agregar concatena las cadenas en lugar de agregarlas como número. ¿Cómo lo soluciono? Perdón por una pregunta tan básica.

 //Script function add(){ var a = document.getElementById('num1').value; var b = document.getElementById('num2').value; return a + b; } console.log(add()); //HTML <p> Input 2 numbers to add</p> <input type="number" id="num1"/> <input type="number" id="num2"/> <input type="submit" value="Add" onclick="add()"> 

Tienes tres opciones.

  1. parseInt

por favor, agregue el análisis de la base 10, ya que guarda el motor para tratar de adivinar a qué base debe analizar el integer.

return parseInt (a, 10) + parseInt (b, 10);

  1. Coerción

el método que prefiero es forzar el tipo de cadena al tipo de número simplemente envolviendo la cadena en un constructor de número

Número de retorno (a) + Número (b);

3.unario más

unario plus es la forma más rápida y preferida de convertir algo en un número. pero el número (a) es mucho más legible en mi opinión.

return + a + + b

Nota: no copie el código incorrecto de las personas que analizan integers sin darle una base para el análisis.

Intenta usar parseInt . Esta function devuelve número

 var a = parseInt(document.getElementById('num1').value); 

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

Debe decirle a javascript que desea trabajar con numbers en lugar de cadenas. Entonces, en lugar de

 function add(){ var a = document.getElementById('num1').value; var b = document.getElementById('num2').value; return a + b; } 

puedes usar

 function add(){ var a = document.getElementById('num1').value + 0; var b = document.getElementById('num2').value + 0; return a + b; } 

o

 function add(){ var a = parseInt(document.getElementById('num1').value); var b = parseInt(document.getElementById('num2').value); return a + b; } 

Debería anteponerlo con + ya que son cadenas y no numbers .

Prueba esto:

 function add(){ var a = document.getElementById('num1').value; var b = document.getElementById('num2').value; var x = +a + +b; return x; } 

o simplemente:

 var a = parseInt(document.getElementById('num1').value); var b = parseInt(document.getElementById('num2').value); var x = a + b; 

Modifique su código en su lugar:

 <html> <body> <p>Input 2 numbers to add</p> <input type="number" id="num1"/> <input type="number" id="num2"/> <input type="submit" value="Add" onclick="add()"> <p id="result"></p> <script> function add(){ var a = document.getElementById('num1').value; var b = document.getElementById('num2').value; var x = +a + +b; document.getElementById("result").innerHTML = x; } </script> </body> </html>