noviceRick
noviceRick

Reputation: 121

jQuery counting with timer

Here is the functionality simply when click btnGo timer will stop and get it's value, if time remaining is not exceed its automatically add +1 to On time total My problem is its not adding it only shows the value below are my codes with live demo

My JS

var sec = $('#timerSec').text() || 0;
var timer;

function startTimer() {
    if (timer) clearInterval(timer);
    sec = 10;
    timer = setInterval(function() {
        $('#timerSec').text(sec--);
        if (sec == 0) {
            clearInterval(timer);
        }
    }, 1000);
}
$(function() {
startTimer();

$('#btnGo').click(function(){
    $(this).fadeOut();
    $("#alert").fadeIn();
    clearInterval(timer);
    var secR = $('#timerSec').text();
    var t = $('#alert span').text()
    $('#btnCon').fadeIn();
    if (secR != 0 ){
    var i = t+1;
    }
    $('#alert span').html(i).show();
});
$('#btnCon').click(function(){
   $("#alert").fadeOut();
    $("#btnGo").fadeIn();
    startTimer();
});


});

My html

<div id="timerSec">10</div> seconds

<a href="#" id="btnGo">Go</a>
<div id="alert" style="display:none">
<a href="#" id="btnCon" >Continue</a>
 On time = <span>0</span>
</div>

Live Demo jsfiddle

Upvotes: 1

Views: 207

Answers (1)

Joseph Marikle
Joseph Marikle

Reputation: 78580

I'm not sure it's functioning as you want it to, but in any case the problem with the addition is that it was treating the text value of the span as a string (which it is). So when you "added" 1 to it, it was actually just concatenating. You can use Number() to fix this. See this updated code.

Upvotes: 1

Related Questions