Can't stop setInterval

Question

I have a function that uses setInterval, but I can´t stop the stop setInterval after it runs once, and don´t know why.

Here my code:

<script type="text/javascript" src="../front-end/js/jquery.min.js"></script>
<script type="text/javascript">
    var jQuery1 = $.noConflict(true);
</script>
<script type="text/javascript" src="../front-end/js/jquery.gvChart-0.1.min.js"></script>
<script type="text/javascript">
    var time = 0;
    gvChartInit();

    function coisa(){
        time = setInterval(function() {
            jQuery1(document).ready(function(){
                jQuery('#chartdiv').gvChart({
                    chartType: 'PieChart',
                    gvSettings: {
                        vAxis: { title: 'No of Visitors' },
                        hAxis: { title: 'Month' },
                        width: 720,
                        height: 300
                    }
                });
            });
        }, 1000);
    }
</script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#jogador").hide()
        $("#selecoes").hide();
        $("#jogoss").hide();
        $("#selecaoList").click(function () {
            $("#index").hide();
            $("#selecoes").show();
            coiso();
            coisa();
            clearInterval(time);
        });

        $("#tagList").click(function () {
            $("#index").hide();
            $("#selecoes").show();
            coiso();
            coisa();
            clearInterval(time);
        });

When I run this every second print's a new chart, but I want that prints only a chart once.

If you only want it to run once, use `setTimeout()` instead of `setInterval()`. — Pointy, May 30 '14 at 14:19
`time` can only reference the id of a single interval. The second time you run the function, the previous id is being overwritten with the new id, making it unstoppable (unless you can guess what the previous id is.) In other words, you need to stop the interval before you start a new one, otherwise you'll never be able to stop it. — Kevin B, May 30 '14 at 14:23

score 0 · Answer 1 · answered May 30 '14 at 14:24

setInterval() executes calls the function again and again after the specified time elapse in a loop, but setTimeout() will call the function only once, so you need to use setTimeout() instead of setInterval()

setInterval()

The setInterval() method calls a function or evaluates an expression at specified intervals (in milliseconds). The setInterval() method will continue calling the function until clearInterval() is called, or the window is closed.

setTimeout()

The setTimeout() method calls a function or evaluates an expression after a specified number of milliseconds. The function executes only once.

You don't explain the bug. Hint : see Kevin's comment. – Denys Séguret May 30 '14 at 14:25 — Denys Séguret, May 30 '14 at 14:25

score 0 · Answer 2 · answered May 30 '14 at 14:26

What you probably want to use is setTimeout() rather than setInterval(). setTimeout() will only execute once and so you don't need to rely on clearing it before it executes a second time, which sounds like your problem.

setTimeout(function(){alert('your code here')},1000);

score 0 · Answer 3 · answered May 30 '14 at 14:37

Have you tried to use clearInterval like clearInterval(window.time); instead of clearInterval(time);?

Maybe the time variable is not recognized there. Also when you define the variable, define it as: window.time = setInterval(function() {....

Also check if the variable is defined console.log(typeof time)

Can't stop setInterval

3 Answers3

setInterval()

setTimeout()