我有一行html
<p>Guess #<span id="count">0</span>!</p>
我需要编写一个函数,每次单击#guessButton
时,都会将<span>
标记中的数字增加1。简单的.replaceWith()
方法不起作用,因为这不算在内。我想我需要一个for循环。
到目前为止,我得到了这个:
$("#guessButton").click(function() {
addOne();
});
addOne()
是我将用于递增的函数的名称。
在addOne()
函数中,我可以使用什么javascript方法来引用html中的数字并使其响应?
创建一个变量count
并将其初始化为零。然后,在每次单击时,递增它并使用.html()
或.text()
方法更新跨度。
var count = 0;
$("#guessButton").click(function() {
count++;
$('#count').html(count);
});
请确保将jquery添加到页面的末尾,或者将其包装在文档就绪处理程序中。
另一种选择是这样做:https://jsfiddle.net/c259LrpL/39/
<button id="guessButton" type="button">guessButton</button>
<p>Guess #<span id="count">0</span>!</p>
<script>
$('#guessButton').click(function() {
$('#count').html(function(i, val) { return val*1+1 });
});
</script>
我对您的评论的简单答案是这里的
<p>Guess #<span id="count">0</span>!</p>
<input type="button" id="guessButton" value="Guess" />
$("#guessButton").click(function() {
var curCount = parseInt($("#count").text(), 10);
$("#count").text(curCount + 1);
});
function addOne() {
$('#count').html(
Number( $('#count').html() ) + 1
);
}