用戶在文本字段中輸入的數字的數值

Question

我需要將用戶輸入的兩個數字相加。 為此，我創建了兩個輸入字段，使用 .val() 在兩個單獨的變量中從中檢索值，然后添加它們。 問題是添加了字符串而不是數字。 例如。 2 + 3 變成 23 而不是 5。請建議做什么，除了在輸入框中使用 type = number。

Answer 1

您可以使用 parseInt(...)

例子：

var num = parseInt("2", 10) + parseInt("3", 10);
// num == 5

Answer 2

使用parseInt將字符串轉換為數字：

var a = '2';
var b = '3';
var sum = parseInt(a,10) + parseInt(b,10);
console.log(sum); /* 5 */

請記住， parseInt(str, rad)僅在str實際上包含多個基本rad時才有效，因此如果您想允許其他基數，則需要手動檢查它們。 另請注意，如果您想要的不僅僅是整數，則需要使用parseFloat 。

Answer 3

Number() 是你想要的函數 "123a" 返回 NAN

parseInt() 截斷尾隨字母“123a”返回 123

<input type="text" id="txtFld" onblur="if(!Number(this.value)){alert('not a number');}" />

• jsfiddle

Answer 4

今天稍微輕松一點。 如果你有一個input[type=number]你可以簡單地做input.valueAsNumber 。

不過，這不適用於每種輸入類型。 它適用於input[type=date]但你可以做input.valueAsDate 。

 Array.from(document.querySelectorAll('input')).forEach(input=>{ input.addEventListener('input', e=>showInputValue(e.currentTarget)) showInputValue(input) }) function showInputValue(input) { input.nextSibling.textContent = ` // input.valueAsNumber -> ${input.valueAsNumber}` }

 body { font-family: monospace; } label { width: 100%; display: flex; } span:first-child, input { width: 6rem; flex: 0 0 6rem; } span:last-child { flex: 1 0 16rem; padding-left: 1rem; }

 <label><span>text: </span><input type="text" value="123"><span></span></label> <label><span>number: </span><input type="number" value="123"><span></span></label> <label><span>range: </span><input type="range" value="123"><span></span></label> <label><span>date: </span><input type="date" value="2022-07-06"><span></span></label>

Answer 5

在添加之前使用 parseInt (http://www.w3schools.com/jsref/jsref_parseint.asp) 或 parseFloat (http://www.w3schools.com/jsref/jsref_parsefloat.asp) 轉換為數值。

PS：這是簡單的答案。 您可能想做一些驗證/剝離/修剪等。