SetTimeout and SetInterval Browser compatibility Analysis _ Basics

Source: Internet
Author: User
Tags anonymous numeric numeric value setinterval
Inadvertently testing Ajaxrequest browser compatibility, found that the Ajaxrequest.update method in some cases in IE have problems, after testing to find settimeout and setinterval problems.
The problem is now when you call the Ajaxrequest.update method, if you have the update interval and the number of updates, then there will be problems under IE, which is the function when the update interval is taken, and the function cannot stop executing after the specified number of updates.
After testing a few examples, we found the problem, in IE, settimeout and setinterval do not support parameter passing.
Demo Address: http://www.xujiwei.cn/demo/usetimer/
The syntax for finding settimeout in Netscape's JavaScript reference is as follows:
Copy Code code as follows:

SetTimeout
Evaluates an expression or calls a function once after a specified number of milliseconds.
Grammar
settimeout (expression, msec)
settimeout (function, msec, arg1, ..., argn)
Parameters
Expression A string containing a JavaScript expression.
msec A numeric value or numeric string, in millisecond units.
The function any function.
Arg1, ..., argn (Optional) The arguments, if any, passed to function.

The second way to use this is to define a timer that, when executed, will pass the parameters defined in the invocation of settimeout to the function, but in IE it does not support calls in this way, that is, when the function is executed, The function does not receive these parameters. As in the following example:
Copy Code code as follows:

<script type= "Text/javascript" >
function Show (str) {
Alert ("My Site:" +str);
}
SetTimeout (show,100, "www.xujiwei.cn");
</script>

In Firefox and Opera, browsers are able to correctly pop-up the prompt box to display the string "My site:www.xujiwei.cn", while in IE, the display is "my site:undefined", stating that the function show did not receive parameter str, So the display is a undefined variable.
Of course, if the variables used inside a function are global variables, you do not have to consider these issues, such as:
Copy Code code as follows:

<script type= "Text/javascript" >
Function Show () {
The URL is a global variable and the function executes correctly
Alert ("My Site:" +url);
}
var url= "www.xujiwei.cn";
SetTimeout (show,100);
</script>

This code works in both IE and Firefox, showing "my site:www.xujiwei.cn."
When a variable is a global variable, you can invoke settimeout using the form of a statement segment, even with the first syntax:
Copy Code code as follows:

<script type= "Text/javascript" >
function Show (str) {
The URL is a global variable and the function executes correctly
Alert ("My Site:" +str);
}
var url= "www.xujiwei.cn";
SetTimeout ("Show (URL);", 100);
</script>

Because the variable URL is a global variable, the timer executes the defined statement segment "Show (URL);" Parameters can be passed correctly, but if the URL is not a global variable, but rather a local variable, the execution results will be wrong:
Copy Code code as follows:

<script type= "Text/javascript" >
function Show (str) {
The URL is a global variable and the function executes correctly
Alert ("My Site:" +str);
}
function Test () {
var url= "www.xujiwei.cn";
SetTimeout ("Show (URL);", 100);
}
Test ();
</script>

There will be an error, and when the function test executes, the URL is not defined and the statement segment "Show (URL) is executed". , the context has been disconnected from the function test, and the URL is defined inside the function test, so the variable URL is released when the function test is executed.
If you want to use local variables in the settimeout, and solve the problem that settimeout in IE does not support parameter passing, you can use anonymous functions, that is, to define an anonymous function in the call to SetTimeout, and to do what you need to do inside the function.
Copy Code code as follows:

<script type= "Text/javascript" >
function Show (str) {
The URL is a global variable and the function executes correctly
Alert ("My Site:" +str);
}
function Test () {
var url= "www.xujiwei.cn";
settimeout (function () {Show (URL);},100);
}
Test ();
</script>

In the example above, when calling settimeout, an anonymous function is defined, and its function body is "show (URL);" Because the function is already defined, so when the timer calls this function, the variable URL is still referenced, because some functions can be executed correctly, displaying the string "My Site : www.xujiwei.cn ".
In general, the following points need to be noted when using SetTimeout or setinterval:
1. When defining the timer, if the expression is used, then the variable should be a global variable, or a direct value, not a local variable.
2. Define the timer when the call function is defined, you should write only the function name, not parentheses, if added is to define the return value.
3. Can not pass the parameter when using the timer in IE.
4. If you want to use the timer in IE to pass parameters, you can use the anonymous function, in the function body to call the original function of the call.

Please correct me if you have any mistakes.

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

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

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

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