Home > Developer > JavaScript

Introduction to SetInterval and settimeout usage in JavaScript

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

The SetInterval () method can call a function or a calculation expression in the specified period (in milliseconds).

The Clearinterval () method can cancel the periodic method call.

When the setinterval call completes, it returns a timer ID that can be used in the future for the timer

Access, and if the ID is passed to clearinterval, the execution of the invoked process code can be terminated.


JS setinterval () usage


Countdown instance

  code is as follows copy code

<script language= "javascript"
Function timer () {

var value= Number (document.all[' time '].value);
if (value==2) {
     timeid=window.setinterval ("Change ()", 1000);
Clearinterval ( Timeid);
}
Else Window.setinterval ("Change ()", 1000);
}

Function Change () {

var value=number (document.all[' time '].value),
if (value>1) document.all[' time '. value=value-1;
Else {
    document.all[' time '].value= ' agree;
return false;
}
}
</script>


<body onload= "timer ()"
<input name= "Time" value= "button" Style= "width:40px;"/>
</body>


JS Clearinterval () method

SetTimeout () method of use in JS class
settimeout (expression, delay time)
settimeout (expression, interaction time)
Delay Time/Interaction time is in Hao seconds (1000ms=1s)

SetTimeout at execution time, after the specified time, after loading, to execute an expression, execute once
SetTimeout at execution time, it executes an expression at a specified time, after it has been loaded

1, Basic usage:
Execute a piece of code:

The code is as follows Copy Code
var i=0;
SetTimeout ("I+=1;alert (i)", 1000);
To perform a function:
var i=0;
settimeout (function () {I+=1;alert (i);},1000);

Note the difference between the two methods above.

Here's another executive function:

  code is as follows copy code

  var i = 0;
   function Test () {
       i+=1;
        alert (i);
  }
   settimeout ("Test ()", 1000);
   can also be like this:
   settimeout (test,1000);

   Summary:
   SetTimeout's prototype is this:
   Itimerid = Window.settimeout (Vcode, Imilliseconds [, Slanguage])
  
  settimeout have two forms

  settimeout (code,interval)
& nbsp settimeout (Func,interval,args)

 

Where code is a string
Func is a function.

Note that the meaning of "function" is an expression, not a statement.
Like you want to perform a function periodically

The code is as follows Copy Code
function A () {
//...
}
can be written as
SetTimeout ("A ()", 1000)
Or
SetTimeout (a,1000)

Note that in the second form, it is a, do not write a (), remember!!!

Solutions for SetInterval and settimeout that cannot pass functions with parameters


In JS, whether settimeout or setinterval, use the function name as the call handle can not take parameters, and in many cases must take parameters,
This needs to be solved in a way.
First, in the form of a string:--(defect) parameters can not be periodically changed
SetInterval ("foo (ID)", 1000);
Second, anonymous function packaging (recommended)

The code is as follows Copy Code

Window.setinterval (function ()
{
Foo (ID);
}, 1000);

This allows you to periodically execute the Foo (ID) function and pass the variable ID in;
Iii. defining functions that return parameterless functions

The code is as follows Copy Code

function foo (ID)
{
alert (ID);
}
function _foo (ID)
{
return function ()
{
Foo (ID);
}
}
Window.setinterval (_foo (ID), 1000);

This defines a function _foo, which receives a parameter and returns a function with no parameters, which uses the arguments of the external function inside the function to invoke it without using parameters.
In window. In the SetInterval function, the _foo (ID) is used to return a function handle with no parameters, thus enabling the function of parameter passing.
Iv. Modification of SetInterval

The code is as follows Copy Code

function foo (ID)
{
alert (ID);
}
var _sto = setinterval;
Window.setinterval = function (Callback,timeout,param)
{
var args = Array.prototype.slice.call (arguments,2);
var _CB = function ()
{
Callback.apply (Null,args);
}
_sto (_cb,timeout);
}
Window.setinterval (Hello,3000,username);

All of the above methods are also suitable for settimeout.

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.

Related Keywords:
introduction to classes and objects introduction to php and mysql settimeout eloquent javascript modern introduction to programming introduction to oops in java introduction to programming and scripting languages introduction to php and mysql pdf
Related Article
JavaScript solution to the eight Queens Problem method summar...
The difference between single and double quotes in JavaScript...
Ajax and 302 response code Testing
Ajax and 302 response code test_javascript-js tutorial

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.

What's Trending
Top 10 Tags
datastax versions naming convention zookeeper client class definition md5 microsoft sql server 2005 data structures exception handling error handling
Top 10 Keywords
microsoft download center down wordpress address url site address url wordpress address url windows installer 4 0 download 302 not found web address url definition site address url wordpress db2 integer mac os installation step by step pdf abbreviation for return

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