Question

I have this jquery code:

    $('#fr_tab').click(function() {
    $("#tab2").empty().html('<img src="images/loading.gif" />');
var handle = setInterval(function () {
    $('#tab2').load('fr_quests.php');
    }, 3000);   
    });

    $('body').click(function() {
        if (handle) {
            clearInterval(handle);
            handle = 0;
        }
    });

I was wondering how I can setIneterval when #fr_tab is clicked and how I can clear it if anywhere in the document has been clicked.

Answer 1

Your handle variable is local to the first function. Remove the var prefix to make it global is the quickest way to make it work, although definitely not the best.

Alternatively, to not use a global variable, then, if the code is in a $(document).ready(…) function then

    $(document).ready(function () {
        var handle
        $('#fr_tab').click(function() {
            $("#tab2").empty().html('<img src="images/loading.gif" />');
            handle = setInterval(function () {
                $('#tab2').load('fr_quests.php');
            }, 3000);   
        });

        $('body').click(function() {
            if (handle) {
                clearInterval(handle);
                handle = 0;
            }
        });
    });