JavaScript Window Object Timeout Methods
In this JavaScript tutorial, you will learn about setTimeout(), clearTimeout() and open() methods of window object along with syntax, usage and examples for each method.
setTimeout():
The
setInterval() method of
Window object is used to call a function or evaluate an expression at specified intervals. The
setTimeout() method of a window object performs in a similar manner. In contrast to the
setInterval() method, the
setTimeout() method of window object is used to call a function or evaluate an expression after a specified number of milliseconds. The
setTimeout() method helps schedule the expression or function for the time specified by the user. The function given in arguments is called or the expression is evaluated after a specified number of milliseconds given as argument in the
setTimeout() method of window object.
General Syntax of the
setTimeout() method of window object:
window.setTimeout(expression/function, milliseconds)
setTimeout() example:
<html>
<head>
<scripttype=”text/javascript“>
function exf()
{
exforsys.close()
}
</script>
</head>
<body>
exforsys = window.open(”,”,’width=100,height=200′)
exforsys.document.write(“Example on setTimeout()
method!”)
exforsys.setTimeout(‘exf()’, 7000)
</body>
</html>
|
The output of the above program is a window
exforsys. This opens with the displayed message:
Example on setTimeout() method!
The window
exforsys is closed after seven seconds. The
setTimeout() method is applied to the window
exforsys with a parameter passed as function
exf(). This performs the action of closing the window
exforsys by the statement
exforsys.close(). This is performed after 7 seconds because the second parameter passed to the
setTimeout() method is 7000 milliseconds.
clearTimeout():
If a user wishes to cancel the timeout set in the
setTimeout() method, he or she can use the
clearTimeout() method of window object. The
clearTimeout() method of a window object is used to cancel a timeout set with the
setTimeout() method.
General Syntax of the
clearTimeout() method of window object:
window.clearTimeout(timeoutID)
The
timeoutID given as argument in the
clearTimeout() method is the ID that is declared or set during the
setTimeout() method.
An example to understand the usage of the
clearTimeout() method of window object:
<html>
<head>
<scripttype=”text/javascript“>
exforsys = setTimeout
(“window.location=’http://exforsys.com/test.html'”,
5000);
</script>
</head>
</html>
|
The above example sends the user to a new page
test.html in exforsys.com after 5 seconds. The
setTimeout method calls the page after 5000 milliseconds or 5 seconds. The ID of the
setTimeout method is set to exforsys.
Using the
clearTimeout() method of window object and the previous example to cancel the timeout set in the
setTimeout() method:
<html>
<head>
<scripttype=”text/javascript“>
clearTimeout (exforsys);
</script>
</head>
</html>
|
In the above example, the timeout created in the previous example is canceled by passing the corresponding ID exforsys set in
setTimeout() method as argument to the
clearTimeout() method of window object.
open():
A new browser window opens using the
open() method of a window object.
General Syntax of the
open() method of window object:
window.open(URL,name,specs,replace)
In the above, all the fields (URL, name, specs, replace) given in arguments are optional.
The URL given in the argument of the
open() method of window object specifies the URL of the page to open. If the user does not mention any URL, then an empty window will be created and opened.
The name field specified in the
open() method of window object is a string denoting the name of the new window. This can be used as the target attribute.
The most commonly used values are:
- _blank This is a default value that denotes that the URL is loaded into a new window.
- _parent This denotes that the URL is loaded into the parent frame.
- _self This denotes and makes the URL replace the current page.
- _top This denotes that the URL replaces any framesets that may be loaded.
- name This denotes the name of the window.
The specs field specified as argument in the
open() method of window object can have numerous items in it, each separated with commas. This is a string denoting the details of the features or attributes that are to be used for the new window. The features have a value as either yes or no and, in some cases, as 1 or 0. Any feature can be turned on, as the user requires or needs to use it.
Some of the features or attributes that are most commonly used are:
- channelmode
- directories
- dependent
- fullscreen
- screenX
- screenY
- height
- left
- location
- menubar
- resizable
- alwaysLowered
- alwaysRaised
- scrollbars
- status
- titlebar
- toolbar
- top
- width
- innerHeight
- innerWidth
- outerHeight
- outerWidth
- hotkeys
The usage, syntax and explanation of the above features will be described in the next section in detail
