更改计数JavaScript函数

目前，此函数似乎一直计算到更高的值。我希望它简单地数到30更改计数JavaScript函数

下限值这是脚本：

$(".circleStatsItemBox").each(function() { 
 
    var value = $(this).find(".value > .number").html(); 
 
    var unit = $(this).find(".value > .unit").html(); 
 
    var percent = $(this).find("input").val()/100; 
 

 
    countSpeed = 2300 * percent; 
 
    endValue = value; 
 

 
    $(this).find(".count > .unit").html(unit); 
 
    $(this).find(".count > .number").countTo({ 
 
    from: 0, 
 
    to: endValue, 
 
    speed: countSpeed, 
 
    refreshInterval: 50 
 
    }); 
 

 
    //$(this).find(".count").html(value*percent + unit); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.rawgit.com/mhuggins/jquery-countTo/master/jquery.countTo.js"></script> 
 
<div class="circleStatsItemBox yellow"> 
 
    <div class="header">Levels of Interest</div> 
 
    <span class="percent">% Increase</span> 
 
    <div class="circleStat"> 
 
    <input value="25" class="whiteCircle" type="text"> 
 
    </div> 
 
    <div class="footer"><span class="count"> 
 
    <span class="number">30</span> 
 
    <span class="unit">Before</span> 
 
    </span> <span class="sep">/</span> 
 
    <span class="value"> 
 
<span class="number">40</span> 
 
    <span class="unit"> During</span> 
 
    </span> 
 
    </div> 
 
</div>

来源

2016-11-14 greggycoding

你能解释一下吗？：'我希望它只计算到30的较低值。' –

当然，对不起可怕的解释。在这个例子中，类“数字”是30，所以我基本上希望计数器只能计数到30 ....或者任何在该html区域中的数据......在这种情况下，它是30 ...计数器似乎计数一直到更高的数字是40 – greggycoding

您需要在JavaScript代码来改变选择。

var value = $(this).find(".count > .number").html();

$(".circleStatsItemBox").each(function() { 
 
    var value = $(this).find(".count > .number").html(); 
 
    var unit = $(this).find(".value > .unit").html(); 
 
    var percent = $(this).find("input").val()/100; 
 

 
    countSpeed = 2300 * percent; 
 
    endValue = value; 
 

 
    $(this).find(".count > .unit").html(unit); 
 
    $(this).find(".count > .number").countTo({ 
 
    from: 0, 
 
    to: endValue, 
 
    speed: countSpeed, 
 
    refreshInterval: 50 
 
    }); 
 

 
    //$(this).find(".count").html(value*percent + unit); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.rawgit.com/mhuggins/jquery-countTo/master/jquery.countTo.js"></script> 
 
<div class="circleStatsItemBox yellow"> 
 
    <div class="header">Levels of Interest</div> 
 
    <span class="percent">% Increase</span> 
 
    <div class="circleStat"> 
 
    <input value="25" class="whiteCircle" type="text"> 
 
    </div> 
 
    <div class="footer"> 
 
    <span class="count"> 
 
     <span class="number">30</span> 
 
     <span class="unit">Before</span> 
 
    </span> 
 
    <span class="sep">/</span> 
 
    <span class="value"> 
 
     <span class="number">40</span> 
 
     <span class="unit"> During</span> 
 
    </span> 
 
    </div> 
 
</div>

来源

2016-11-14 19:19:56

虽然不能完全确定那里出了什么问题，但仍然有效。非常感谢您的帮助 – greggycoding

唯一的问题是它附加了较大的数字文本而不是“之前” – greggycoding

“.value> .number”'选择器将计数的结束值设置为40.更改将选择器设置为'“.count> .number”'将值设置为30。 –

更改计数JavaScript函数

回答

相关问题