JavaScript Window Object Timeout Methods

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.

[catlist id=157].

Related posts