JS function that stops another JS function

Question

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 !

Seimen · Accepted Answer · 2013-04-15 10:05:17Z

1

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>

edited Apr 15, 2013 at 10:05

answered Apr 15, 2013 at 9:50

Seimen

7,2942 gold badges30 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user2275278 Over a year ago

Thank you for your answer. You are right, by using the "none" value the progress bar is displayed in each page, but still the kill function is not working properly: when the page is loaded the progress bar is there showing the progress. I'm till trying to find out how to make it disappear once the page is loaded. I added the clearTimeout() but it is not affecting the progress bar. Any suggestions would be greatly appreciated. Thank you.

user2275278 Over a year ago

Problem solved. I had to add the clearTimeout in the kill(). Everything is working properly now. Thank you.

asifrc · Accepted Answer · 2013-04-15 09:53:15Z

0

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 :)

answered Apr 15, 2013 at 9:53

asifrc

5,8412 gold badges20 silver badges22 bronze badges

2 Comments

user2275278 Over a year ago

Thank you for your reply. I did try the clearTimeout from the previous answer but I still see the progress bar when the page is loaded. Is there any other way to kill a JS function ? Thank you for your help.

user2275278 Over a year ago

Problem solved. I had to add the clearTimeout in the kill(). Everything is working properly now. Thank you.

Collectives™ on Stack Overflow

JS function that stops another JS function

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related