javascript - 常规 js int 和 jquery.val() 中的 int 有什么区别？

Question

我正在使用名为 countUp.js 的脚本它基本上以动画方式递增一个整数，直到达到所需的数量。

这是我的代码:

HTML:

<h2 id="countUp-1">2500</h2>

JS

var theval = 5000;
var demo = new CountUp("countUp-1", 0, theval, 0, 2.5);
demo.start();

这成功地将我的计数器从 0 动画化到 5000。完美。

但我想要做的是为 h2 标签中已有的值 (2500) 设置动画。所以我尝试了这个。

var theval = parseInt($('#countUp-1').val());
var demo = new CountUp("countUp-1", 0, theval, 0, 2.5);
demo.start();

但是这样我得到了错误:“Uncaught TypeError: c.match is not a function”

怎么会这样呢？在这两种情况下我只是将 int 发送到 CountUp 函数？

在这里设置一个 fiddle :

https://jsfiddle.net/0yawm9jr/

Answer 1

$('countUp-1').val() 不存在(您的特定元素上没有 value 属性)。试试这个(参见working jsfiddle):

var theval = 5000;
var demo = new CountUp("countUp-1", 0, theval, 0, 2.5);
demo.start();

var theval2 = parseInt($('#countUp-2').html().split(',').join(''));
var demo2 = new CountUp("countUp-2", 0, theval2, 0, 2.5);
demo2.start();

jQuery 方法.val() 检索元素的value 属性的内容。在您的例子中，您只是使用一个 HTML 元素，并将 innerHTML 设置为您的值。因此，您需要调用 $(yourElement).html()。

此外，您的号码包含逗号，因此我们需要在逗号处拆分号码，然后重新连接，不包含非数字字符。