user2275278
user2275278

Reputation: 1

JS function that stops another JS function

I have two JS functions: a load() function that displays a progress bar and a kill () function that stops the execution of the load once the page is loaded. Now when another page is loaded the progress bar is not displayed, knowing that the load function is called on every page. Any hints on where the problem might be and if there is a way to fix it.

Here is my code:

<script type="text/javascript">
    var count=0;
    function load(i) {
        j = parseInt(i);
        document.getElementById("progressBar").style.display = "block";
        count=count+1;
        if (document.all) { 
            document.all.btn1.value=count+'%';
            document.all.progressbar.pic1.width=2*count;
        }
        else { 
            document.getElementById("pic1").width=2*count;
            document.getElementById("bar").width=count+'%';
        } 
        if (count<100) {
            setTimeout('load(j)',j);
        }
        if(count==100) { 
            document.getElementById("progressBar").style.display = "none";
            count=0;
        }
    }

    function kill(){
        if (document.applets[0].isActive()) {
            document.getElementById("progressBar").style.visibility = "hidden"; 
        } 
    }

</script>

Thank you in advance !

Upvotes: 0

Views: 138

Answers (2)

Seimen
Seimen

Reputation: 7250

In load() you're changing display to block, but in kill() you set visibility to hidden; you should set display to none instead, so it can properly be set to block again next time. Read about visibility.

Optimized code:

<script type="text/javascript">
    var count = 0,
        win = window,
        doc = document,
        progressBar = doc.getElementById("progressBar"),
        t, j;

    function load(i) {
        j = parseInt(i);
        progressBar.style.display = "block";
        count++;

        // no actual need to check if doc.all is available
        // just select through id
        doc.getElementById("pic1").style.width = 2*count;
        doc.getElementById("bar").style.width = count+'%'; 

        if (count < 100) {
            t = win.setTimeout('load(j)',j);
        } else { 
            progressBar.style.display = "none";
            win.clearTimeout(t);
            count = 0;
        }
    }

    function kill(){
        if (doc.applets[0].isActive()) {
            progressBar.style.display = "none";
        } 
    }

</script>

Upvotes: 1

asifrc
asifrc

Reputation: 5841

If you assign setTimeout to a variable, you can use clearTimeout on it to stop it.
E.g. set the timeout with t = setTimeout('load(j)',j); then stop it with clearTimeout(t); Let me know if that helps, and makes sense :)

Upvotes: 0

Related Questions