Clear the same interval multiple times

Jax Flaxx Source

I have a problem with this clearInterval method. Let me explain.

I have three javascript tabs, LOW | MEDIUM | HIGH.

When I go into the index page, the LOW tab is default open. And interval AjaxLow starts. Like this:

function ajaxCall() {
        url: "ajax.php", 
        success: (function (result) {
             var res = $.parseJSON(result);
             var str1 = "<center><img src='";
            var str3 = " ' height='60' width='70'/></br>";
            var mes = [];
            var div = [];
            var totalLowPot = 0;
            for (kil = 0; kil < res[0].length; kil++) {
            mes[kil] = str1.concat(res[0][kil], str3)+res[1][kil]+"$</center>";
             totalLowPot = totalLowPot + parseFloat(res[1][kil]);
             document.getElementById("totalLowPot").innerHTML = totalLowPot.toFixed(2);
var ajaxLow = setInterval(ajaxCall, (1 * 250)); // x * 1000 to get it in seconds

But when I click on another tab, e.g MEDIUM. The ajaxLow interval should stop. And it does since I am calling this function.

function clearLow() {


<button class=tablink onclick="openCity('low',this,'#f1f1f1');" id=defaultOpen>LOW</button>
<button class=tablink onclick="openCity('medium',this,'#f1f1f1'); clearLow();">MEDIUM</button>
<button class=tablink onclick="openCity('high',this,'#f1f1f1')">HIGH</button>

But when I click back into the LOW tab, the interval didn't start again. So I tried calling the ajaxLow; again when you press on the LOW tab.

This is how I tried calling ajaxLow again:

<button class=tablink onclick="openCity('low',this,'#f1f1f1'); ajaxLow;" id=defaultOpen>LOW</button>

This is where the real problem appears, it refuses to clear the ajaxLow function again and it just keeps on running. Do you have any suggestions for me?



comments powered by Disqus