javascript如何暂停/恢复功能?

时间:2017-08-23 05:16:26

标签: javascript jquery

如何暂停/恢复里程表(以便暂停/恢复)?我希望每次点击时都能暂停/恢复里程表。暂停 - 恢复按钮。

这是我的代码:

https://jsfiddle.net/aht87opr/27/

    $('button').click(function() {
        var currentvalue = myOdometer.get();
  $('#value').text(currentvalue);
});

2 个答案:

答案 0 :(得分:2)

使用setInterval函数

var n = 0,
  timerID;
var myOdometer;
var div = document.getElementById("odometerDiv");
myOdometer = new Odometer(div, {
  value: n,
  digits: 6,
  tenths: true
});
myOdometer.set(0);

function startcounting() {


  timerID = setInterval(function() {
    n = n + 0.01
    myOdometer.set(n);
  }, 200);

}

//]]>

startcounting();


var started = true;

$('button').click(function() {

  if (started)
    clearTimeout(timerID);

  else
    startcounting();

  started = !started;

  var currentvalue = myOdometer.get();
  $('#value').text(currentvalue);
});

fiddle

答案 1 :(得分:1)

var n = 0;
var timer;
var myOdometer;
function startcounting () {
var div = document.getElementById("odometerDiv");
myOdometer = new Odometer(div, {value: n, digits: 6, tenths: true});
myOdometer.set(0);  
update();
}

function update () {
timer = setInterval(function() {
n = n + 0.01
myOdometer.set(n);}, 200);}
startcounting();
var state = true;
$('button').click(function() {
if (state)
clearTimeout(timer);
else
update();
state = !state;
var currentvalue = myOdometer.get();
$('#value').text(currentvalue);
});