Question

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

Answer 1

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.