javascript - 为只读文本输入字段的 jQuery 值添加 +1

Question

我正在使用一个有readonly文本input的函数，当我执行该函数时，我想要数值 + 1。假设我有 60，当我执行该函数时，返回的数字应该是 61。

但它却出现了 601，它只是将数字 1 添加到字符串中。关于发生了什么的任何线索？减法，乘法和除法都可以正常工作。这是一个片段

 var num= $("#originalnum").val() + 1;
 $("#originalnum").val(num);

是的，我尝试了一些不同的变化，我错过了什么吗？

Answer 1

在这种情况下，一个简单的一元+足以将字符串转换为数字：

var num = +$("#originalnum").val() + 1;
$("#originalnum").val(num);

Answer 2

问题在于.val()将元素的值作为字符串返回，并且当您+在字符串上使用运算符时，它会进行字符串连接。您需要先将值转换为数字：

var num = +$("#originalnum").val() + 1;            // unary plus operator
// OR
var num = Number($("#originalnum").val()) + 1;     // Number()
// OR
var num= parseFloat($("#originalnum").val()) + 1;  // parseFloat()
// OR
var num= parseInt($("#originalnum").val(),10) + 1; // parseInt()

请注意，如果您使用，则parseInt()必须将基数 (10) 作为第二个参数，否则它将（取决于浏览器）将带有前导零的字符串视为八进制，将带有前导的字符串"0x"视为十六进制。另请注意，parseInt()忽略字符串末尾的任何非数字字符，包括用户可能打算作为小数点的句号，因此parseInt("123.45aasdf",10)返回123. 同样parseFloat()忽略字符串末尾的非数字字符。

此外，如果它是用户输入的值，您应该仔细检查它是否真的是一个数字，如果不是，则可能提供错误消息。

当您使用*,/或-运算符时，JS 会尝试自动将字符串转换为数字，这就是这些运算符“工作”的原因（假设字符串可以转换）。

Answer 3

您应该使用该parseInt函数并确保值为数字（使用 isNaN 函数）：

var val = $("#originalnum").val();

var num = 0;

if ( !isNaN(val) )
  num= parseInt(val) + 1;

Answer 4

使用parseInt()：

var num= parseInt($("#originalnum").val(),10) + 1;

因此，您的数字被视为整数而不是字符串（.val()默认情况下将结果视为字符串）

Answer 5

如果你不喜欢上面的代码拼写，你也可以这样尝试。

$("#originalnum").val(function() {
   $(this).val(parseInt($(this).val()) + 1)
});