[英]How do I make document.getElementById('id').value return a number not a string in Javascript
我正在制作一个表格供用户输入数字，然后尝试显示总和。 但是document.getElementById('someid').value正在返回一个字符串。 因此，我的 add 函数是连接字符串而不是将它们添加为数字。 我该如何解决。 抱歉问这么基本的问题。
//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()">
尝试使用parseInt 。 此函数返回数字
你有三个选择。
请添加基数为 10 的解析，因为您可以避免引擎尝试猜测它应该将整数解析为哪个基数。
返回 parseInt(a, 10) + parseInt(b, 10);
我更喜欢的方法是通过简单地将字符串包装在数字构造函数中来将字符串类型强制转换为数字类型
返回数字（a）+数字（b）；
3.一元加
一元加号是将某物转换为数字的最快和首选方式。 但我认为 Number(a) 更具可读性。
返回 +a + +b
注意：不要从解析整数的人那里复制错误的代码，而不给它一个解析的基础。
var a = parseInt(document.getElementById('num1').value);
你应该在它前面加上+因为它们是字符串而不是数字。
试试这个：
function add(){
var a = document.getElementById('num1').value;
var b = document.getElementById('num2').value;
var x = +a + +b;
return x;
}
或者，简单地说：
var a = parseInt(document.getElementById('num1').value);
var b = parseInt(document.getElementById('num2').value);
var x = a + b;
改为修改您的代码：
<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>
您必须告诉 javascript 您想要使用数字而不是字符串。 所以代替
function add(){
var a = document.getElementById('num1').value;
var b = document.getElementById('num2').value;
return a + b;
}
你可以使用
function add(){
var a = document.getElementById('num1').value + 0;
var b = document.getElementById('num2').value + 0;
return a + b;
}
或
function add(){
var a = parseInt(document.getElementById('num1').value);
var b = parseInt(document.getElementById('num2').value);
return a + b;
}
parseInt(document.getElementById("id").value)对于整数parseFloat(document.getElementById("id").value)对于浮点数所以小数
如何将 document.getElementById 值变成整数变量，而不是字符串？
[英]How to make a document.getElementById value into an integer variable, not a string?
如何从document.getElementById javascript制作下拉菜单
[英]How do I make drop down menu from document.getElementById javascript
如何使用 document.getElementById(“abc”).innerHTML DOM 以字符串格式显示 JavaScript object 的内容？
[英]How do I display the content of a JavaScript object in a string format using document.getElementById(“abc”).innerHTML DOM?
当元素是空文本框时，Javascript document.getElementById("id").value 返回 null 而不是空字符串
[英]Javascript document.getElementById("id").value returning null instead of empty string when the element is an empty text box
document.getElementById([id]).value 返回一个空字符串
[英]document.getElementById([id]).value returns an empty string
函数 var value = document.getElementById(id).files[0] 在 JavaScript 中有什么作用？
[英]What does the function var value = document.getElementById(id).files[0] do in JavaScript?
document.getElementById不返回null，但也没有做我想要的。 在javascript控制台中没有错误
[英]document.getElementById does not return null, but also does not do what I want. No error in javascript console
如何避免一长串document.getElementById（'id'）。value
[英]How to avoid a long list of document.getElementById('id').value
document.getElementById（'id'）是null javascript错误
[英]document.getElementById('id') is null javascript error
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.