jQuery在文本中添加一个数字

Question

我正在尝试做一些事我虽然很简单.将值1添加到数字中.

然而,数字是纯文本,事情变得有点混乱.正如你可能猜到的那样,我对此很新.

我的目标是在现有分数上加1分,分数有一个小数位,例如1.3.因此,添加点后的期望结果是2.3.但是我写的当前脚本是返回添加点到第二个小数位,我不明白为什么.

谢谢您的帮助.

var getPoints = parseInt($('.awesome-points').text(), 10).toFixed(1);
alert(getPoints);
var addPoint = 1;
var newScore = getPoints + addPoint;
$('.awesome-points').text(newScore);

标记

Answer 1

.toFixed()返回一个字符串(参见MDN文档),这就是为什么getPoints + addPoint执行字符串连接而不是添加.

执行添加后调用该方法:

// unary + converts any numerical string to a number (no matter whether float
// or int)
var getPoints = +$('.awesome-points').text();
var newScore = getPoints + 1;
$('.awesome-points').text(newScore.toFixed(1));

或者更简洁:

$('.awesome-points').text(function(i, val) {
    return (+val + 1).toFixed(1);
});

这是如何工作的:

您可以传递函数.text(),而不是传递值.将对每个所选元素执行此功能.传递给函数的第一个参数是所选元素集中元素的索引,第二个参数是当前文本内容.返回值将设置为新文本内容. 这是一种读取和写入文本内容的好方法,无需调用两次.
.text()

(+val + 1).toFixed(1)评估如下:首先val通过一元加号(+val)转换为数字,然后再增加一(+ 1)..toFixed(1)被调用该操作的结果.

+val将返回NaN如果文本不能成功转换成一个数字.我认为这不会发生在你的情况下,但这可以很容易地用表达式来处理

return ((+val || 0) + 1).toFixed(1); 

这意味着,如果+val评估为false(包括NaN),我们会使用0.这是JavaScript中的常见模式,另请参阅Javascript 中"options = options || {}"的含义是什么？.