CODEWITHSUNDEEP
javascriptjqueryjquery-mobile
Bonesh
Bonesh

Reputation: 837

Javascript/JQuery time counter

Im looking for :

count time - in seconds & minutes. my count i want it start when one button is clicked and stop if clicked again. my counting from zero for every button when clicked.

here is what i tried but it seems not working.

function toggle(ths) {
    $(ths).toggleClass("btnColor");
    $("#tb").toggleClass("btnColorR")
    var secondCounter = 0;
    var minutes = 0;
    var t;
    var timer_is_on = 0;
    var clicked = $(ths).val();
    secondCounter = secondCounter + 1;
    if ((secondCounter % 60 == 0 )&&(clicked)) {
        minutes += 1;
        secondCounter = 0;
    }
    $("#setCount").html(" downtime type: " + clicked + " minutes: " + minutes + "     seconds: " + secondCounter);
}

Upvotes: 0

Views: 2240

Answers (3)

Vadim
Vadim

Reputation: 8779

If you want to know how much time button was toggled down, you can try this code:

var displayElapsedTime,
    startTimeCounter,
    isDown;

isDown = function isDown($this) {
  return $this.is('.down');
};

displayElapsedTime = function displayElapsedTime($this) {
  var time = new Date((new Date()) - $this.data('time'));
  $this.val(time.getMinutes() + ':' + time.getSeconds());
};

startTimeCounter = function startTimeCounter($this) {
  setTimeout(function() {
    displayElapsedTime($this);
    if(isDown($this)) {
      startTimeCounter($this);
    }
  }, 1000);
};

$('input').on('click', function() {
  var $this = $(this);

  if(!isDown($this)) {
    $this.data('time', new Date());
    startTimeCounter($this);
  }

  $this.toggleClass('down');
});

You can see working example here: http://jsbin.com/ahafez/3/edit

Upvotes: 0

jsshah
jsshah

Reputation: 1741

I am assuming you need a way to find the time elapsed between two clicks on the button

Also assuming that on the second click you want to know the time it took since the last time it was clicked and reset the counter

If so I have a simple jsfiddle that you can look at: http://jsfiddle.net/8cjBj/

HTML CODE:

<a href="#" id="btn">This is a button</a>

JS CODE:

var start = 0;
var end = 0;

$('#btn').click(function(event){
    event.preventDefault();

    if(start == 0)
        start = new Date();
    else
    {
        end = new Date();
        millis = end - start;
        var totalSeconds = parseInt(millis / 1000);
        var minutes = parseInt(totalSeconds / 60);
        var seconds = totalSeconds % 60;
        alert('Elapsed Time: ' + minutes + ' Minutes and ' + seconds + ' seconds');
        start = 0;
    }

});

Upvotes: 0

anil
anil

Reputation: 156

Question would be clear if you post html code which is calling that toggle() function.

My guess is minutes and secondCounter are resetting to 0 every time toggle() function is called.

Upvotes: 1

Related Questions