javascript - jquery 使用来自 div 的值创建计数器

Question

我正在尝试使用 jquery 创建一个脚本，该脚本从指定的 div （下面的#counter）中提取一个数字并每秒添加 100 并更新 div 中的数字。我已经尝试了很多东西，但没有达到预期的结果。有小费吗？这是我目前拥有的：

<script type="text/javascript">

setInterval("counter()", 1000); // run counter function every second

function counter() {
  var count = $("#counter").val();  // get value of counter div
  var total = count+100;  // add 100 to value of counter div
  $("#counter").text(total); // update counter div
}

</script>

<div id="counter">1000</div>

Answer 1

一些变化：

function counter() {
    var count = parseInt($('#counter').text(), 10);
    $('#counter').text(count + 100);
}

setInterval(counter, 1000);

1. 不要将字符串传递给setInterval. 总是传递一个函数。
2. .val()仅适用于<input>元素。您需要使用.text()（这将返回一个字符串），因此您需要将文本解析为带有parseInt(). 10告诉parseInt假设base-10 。

Answer 2

编辑 - 像其他人提到的那样添加 parseInt 。

你没有正确调用 counter() ，你应该使用 .html() 而不是 val() 像这样：

<script type="text/javascript">

setInterval(counter, 1000); // run counter function every second

function counter() {
  var count = $("#counter").html();  // get value of counter div
  var total = parseInt(count)+100;  // add 100 to value of counter div
  $("#counter").text(total); // update counter div
}

</script>

<div id="counter">1000</div>

Answer 3

这是工作代码：http: //jsfiddle.net/FbJPY/3/

问题是您的时间间隔不起作用，并且您没有从 div 的内容中解析数字。

修复：

• Interval 应该引用一个函数，而不是一个变量，因此您可以键入不带引号的 counter。

• 您需要从 div 的内容中解析数字。

setInterval(counter, 1000); // run counter function every second

function counter() {
  var count = parseInt($("#counter").text(), 10);  // get value of counter div
  var total = count + 100;  // add 100 to value of counter div
  $("#counter").text(total); // update counter div
}

Answer 4

尝试将计数转换为整数？

var total = parseInt(count, 10) + 1000;

除非是表单输入，否则应使用 jquery html() 而不是 val()。

var count = $('#counter').html();

还注意到您没有将函数引用正确传递给 setInterval()

setInterval(counter, 1000);

Answer 5

利用

parseint($("#counter").html(), 10) // or ~~$("#counter").html()

乃至

$("#counter").html(total)

反而