Home > Others

JS page load progress bar code

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

JS page load progress bar code
<script language= "JAVASCRIPT" >

var timerid=null; <!--delay variable-->
var count=0; <!--loop variable for Progress-->
var Running=false; <!--The amount of--> that is being formatted

function Randomnumber (max) <!--functions used to produce random numbers-->
{var today = new Date (); <!--Create a time Date object-->
var num= math.round (Math.Abs (Math.sin (Today.gettime ()) *1000))%max+1; <!--uses the current time date value to take certain algorithm to produce the random number, in which the decimal part is processed according to the rounding rule-->
return num;
}


Function stopaction ()                      <!--function to stop the formatting operation;
{if (running)                               <!--If you are formatting, clear the Timerid delay operation;
   cleartimeout (Timerid);
  running=false;                           <!--Set the flag variable to False-->
}


function StartAction () <!--functions used to begin formatting operations-->
{stopaction (); <!--stop formatting operations-->
Action (); <!--formatting operations-->
}


Function action ()
{if (count!=100) <!--If the format progress is less than 100, the percentage that has been completed is displayed-->
{document.outputform.output.value= "is downloading the file, current progress:" +count+ "%";
count++; <!--count Plus 1-->
Timerid=settimeout ("Action ()", 200+randomnumber (500)); <!--call the random number generation function to calculate and set the delay length-->
Running=true; <!--Mark Quantity is true-->
}
Else
{document.outputform.output.value= "Download complete ..."; <!--If the format progress is 100, the display format is finished-->
Stopaction (); <!--stop-->
}
}


</script>
<body onload= "startaction ()" >

<form name= "Outputform" >
<p><input type= "TEXT" name= "Output" size= "></p>"
</form>

<!--This case simulates a progress bar feature for a formatted hard drive-->
The progress of the <!--format is computed by a random number of-->
<!--This random number is based on a certain calculation rules for the current system of processing the time-->
<!--indicates that the format is complete when the progress is 100-->

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More