HTML 5 Networking Events Support

I recently wrote an article about the HTML 5 DOM Storage technology, which appeared in Internet Explorer 8 . In this article, I would like to consider another part of HTML 5, whose support appeared in IE8. This technology is an extension of browser events under the general title Networking Events . In this article I will try to consider three such events: onhashchange , ononline , onoffline .



The events described below are defined in the HTML 5 A draft of the vocabulary and associated APIs for HTML and XHTML . I did not manage to find descriptions of implementations of these events in other browsers. Therefore, we can assume that Internet Explorer 8 is the first and so far the only browser that supports new HTML 5 events.

onhashchange

The window.onhashchange event is designed to greatly simplify the life of the developer of ajax applications or applications with rich client functionality. The browser raises the window.onhashchange event when the hash part of the URL changes. Let's say such an event will be triggered when the user moves from the address example.domain / test.aspx # page1 to example.domain / test.aspx # page2 . Another way to trigger this event is to set a new value for location.hash .



Example of use:

< script type ="text/javascript" >



function HashChangeHandler() {



alert( ' hash = ' + location.hash);



}



</ script >



…



< body onhashchange ="HashChangeHandler();" >



< a href ="#link1" > </ a >



< a href ="#link2" > </ a >



…

</ body >



* This source code was highlighted with Source Code Highlighter .

ononline and onoffline

These events are triggered by the browser when the browser determines that the Internet connection is lost or, conversely, has resumed. These properties are useful for client code, allowing you to react to situations when the user is disconnected from the Internet while working with important data, which the user may not even notice. In such cases, the application can notify the user, perform some operations to preserve its state, or block a number of functions.

')

Example of use:

function inoffline(e) {

if (!e) e = window. event ;

...

alert( '! .' );

}



window.onload = function () {

document .body.onoffline = inoffline;

}



* This source code was highlighted with Source Code Highlighter .

Additional Information

• screencast on HTML 5 Networking Events on MSDN msdn.microsoft.com/en-us/ie/dd578301.aspx ;
• onchange on MSDN msdn.microsoft.com/en-us/library/cc288209 (VS.85) .aspx ;
• onoffline on MSDN msdn.microsoft.com/en-us/library/cc304126 (VS.85) .aspx ;
• ononline on MSDN msdn.microsoft.com/en-us/library/cc304127 (VS.85) .aspx ;
• W3C HTML 5A vocabulary and associated APIs for HTML and XHTML www.w3.org/TR/2009/WD-html5-20090212/browsers.html#handler-window-ononline .