CODEWITHSUNDEEP
javascriptjquerysetintervalanonymous-functionclearinterval
Borja
Borja

Reputation: 3559

How run again a setInterval function after used clearInterval method ? - Javascript

i have a doubt.... Is possible to run again a setInterval() function after used clearInterval() method ? 

    var statistiche_recenti_storico = 0;
    var orologio_statistiche_recenti;
    orologio_statistiche_recenti = setInterval(function() {
      if (statistiche_recenti_storico == 0) {
        statistiche_recenti_storico = 1;
        alert('end');
        clearInterval(orologio_statistiche_recenti); 
      }
    }, 5000);

    $('#ok').on('click', function(){
        // ????
    });

I want to run again orologio_statistiche_recenti after clicked #ok. Is possible ?

This code is inside ready() event (JQuery).

Thanks a lot and sorry for my english...

EDIT Here a jsfiddle example: https://jsfiddle.net/tr9hw30a/

Upvotes: 0

Views: 197

Answers (3)

Lee Brindley
Lee Brindley

Reputation: 6532

Create a function, and invoke that in your code, that is a viable approach.

I have wrapped your code in a IIFE, this stops the 'vars' becoming part of the global scope, you say you have your code inside a jQuery ready function, so this is not necessary for you.

I defined a function 'startInterval', this handles the creation of your interval, this gets called at the bottom of the script, and in the click handler. Note, if you do not want to interval to fire as soon as the script has been run, remove the call to startInterval at the bottom of the script, leaving just the call in the click handler.

I also made a check in the startInterval function to clear any existing interval which is running, i.e. to stop duplicates.

// Wrapped in ann IIFE for scoping
(function () {

    var statistiche_recenti_storico = 0;
    var orologio_statistiche_recenti;

    // Define a function which handles the creation of your interval
    function startInterval () {

        // Delete any existing interval
        if (orologio_statistiche_recenti) {

            // You could add a return here instead...
            clearInterval(orologio_statistiche_recenti);
        }

        orologio_statistiche_recenti = setInterval(function() {
            if (statistiche_recenti_storico == 0) {
                statistiche_recenti_storico = 1;
                alert('end');
                clearInterval(orologio_statistiche_recenti); 
            }
        }, 5000);
    }


    $('#ok').on('click', startInterval);

    //Start your interval, by invoking the function
    startInterval();

})();

Full example below. The above was working just fine, your alert was only firing once due to your IF statement, the interval was in-fact being triggered. 

<!doctype html>
<html>
    <body>

        <button id="ok">OK</button>
        <script
            src="https://code.jquery.com/jquery-2.2.4.min.js"
            integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
            crossorigin="anonymous">
        </script>

        <script>
            // Wrapped in ann IIFE for scoping
            (function () {

                var statistiche_recenti_storico = 0;
                var orologio_statistiche_recenti;

                // Define a function which handles the creation of your interval
                function startInterval () {

                    // Delete any existing interval
                    if (orologio_statistiche_recenti) {

                        // You could add a return here instead...
                        clearInterval(orologio_statistiche_recenti);
                    }


                    orologio_statistiche_recenti = setInterval(function() {

                        if (statistiche_recenti_storico == 0) {

                            // @BUG
                            // You were setting this to 1 after the first interval
                            // thus subsequent calls to this were not triggering the alert.

                            // statistiche_recenti_storico = 1;
                            alert('end');
                            clearInterval(orologio_statistiche_recenti); 
                        }
                    }, 5000);
                }


                $('#ok').on('click', startInterval);

                //Start your interval, by invoking the function
                startInterval();

            })();
        </script>
    </body>
</html>

Upvotes: 1

Matthi
Matthi

Reputation: 1063

	//ogni secondo lancio questo codice con il setInterval
	var statistiche_recenti_storico = 0;
	var orologio_statistiche_recenti;

    var startTimeout = function() {
        if (orologio_statistiche_recenti) {
            clearTimeout(orologio_statistiche_recenti); //interrompo questo setInterval
        }
        orologio_statistiche_recenti = setTimeout(function() {
        console.log('timeout executed');
   	  if (statistiche_recenti_storico == 0) {
	    statistiche_recenti_storico = 1;
	    alert('end');
	  }
	}, 5000);
      }
      startTimeout();

$('#ok').on('click', startTimeout);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="ok">OK</div>

It actually seems you want to have a timeout instead of an interval. You stop it after the first execution.

Upvotes: 0

Sumesh TG
Sumesh TG

Reputation: 2575

var statistiche_recenti_storico = 0;
    var orologio_statistiche_recenti;
    var intervalFn=function() {
      if (statistiche_recenti_storico == 0) {
        statistiche_recenti_storico = 1;
        alert('end');
        clearInterval(orologio_statistiche_recenti); 
      }
    }
    orologio_statistiche_recenti = setInterval(intervalFn, 5000);


    $('#ok').on('click', function(){
        // ????
      setInterval(intervalFn, 5000);
    });

Make it as a separate function and call again using setInterval(functionName, interval) wherever you want.

Upvotes: 0

Related Questions