[英]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.