在JAVASCRIPT中显示自动增量

时间:2016-09-17 02:06:00

标签: javascript jquery

我希望在累积奖金量上设置自动增量动画,因为我希望增量从4开始直到结束。因为我有工作javascript但这个javascript包含onclick,我希望不要onclick

我们怎么做的?

我的HTML:

<div class="ticker">
    <div id="total-ticker" class="total-ticker"><span class="jackpot jackpot_num">2</span> <span class="jackpot jackpot-comm">&nbsp;</span><span class="jackpot jackpot_num">5</span> <span class="jackpot jackpot_num">6</span> <span class="jackpot jackpot_num">2</span> <span class="jackpot jackpot-comm">&nbsp;</span><span class="jackpot jackpot_num">3</span> <span class="jackpot jackpot_num">0</span> <span class="jackpot jackpot_num">7</span> <span class="jackpot jackpot-dot">&nbsp;</span><span class="jackpot jackpot_num">9</span> <span class="jackpot jackpot_num">4</span> </div>
</div>

示例:

$2  5 6 2  3 0 7  9 4

Javascript:

jQuery.fn.extend({
  animateCount : function (from, to, time) {
    var steps = 1,
        self = this,
        counter;

    if (from - to > 0) {
      steps = -1;
    };

    from -= steps;

    function step() {
      self.val(from += steps);

      if ((steps < 0 && to >= from) || (steps > 0 && from >= to)) {
        clearInterval(counter);
      };
    };

    counter = setInterval(step, time || 100);
  }
});

$('#runner').click(function() {
    $('#count').animateCount(1,100);
})

1 个答案:

答案 0 :(得分:0)

非常简单......将计数器插件初始化从点击处理程序中取出并在页面加载时进行初始化

$(function(){// make sure dom is ready  
    $('#count').animateCount(1,100);
});