« CHAPTER 6 DECOUPLED NAVIGATION PATTERN (Web design seattle) Decoupled Navigation
CHAPTER 6 DECOUPLED (Web server version) NAVIGATION PATTERN 167 The »

166 CHAPTER 6 DECOUPLED NAVIGATION PATTERN (Make my own web site) Even

166 CHAPTER 6 DECOUPLED NAVIGATION PATTERN Even though this discussion of the HTML structure might seem basic and long-winded, it is important to realize that there is a nested structure because HTML event bubbling and how it occurs is directly related to this structure. Looking back at the HTML code, you can see that the div HTML element has the onclick attribute, which implements the onclickevent. From a traditional programming perspective, the defined onclickevent would capture only click events that relate directly to the div element. With event bubbling, the defined event will be triggered for all click events that involve the div element and one of its descendent elements. This means that if the nested button is clicked, the OnClick function is called. Event bubbling is a clever way to define collecting-type events that can be triggered by multiple HTML elements. However, event bubbling works only if the event bubbles. There are some HTML events that will not bubble and are specific to the HTML element. Let s say that an event has been triggered and is bubbling up the chain. If the event is caught and processed, the caught event can be canceled. The way to cancel the event is to return false, as illustrated by the following example:

Canceling an event that is bubbling works only if the event can be canceled. Canceling every onclick event is a solution when you don t want the browser to process certain events to disable functionality. In the example HTML, the event called the OnClick function will process the click event for multiple HTML elements. The implementation of the function is as follows: E B V N function OnClick( evt) { evt = (evt) ? evt : ((event) ? event : null); if( evt) { var elem = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null); if( elem) { document.getElementById( “eventDestination”).innerHTML = “Click (” + elem.id + “)”; } } } When an HTML event is triggered, the details of the event are not cross-browser compat ible. To make the event cross-browser compatible, several extra steps need to be carried out. The function OnClick has a single parameter, evt, which is supposed to represent the event. But the function signature for an event, which has a single parameter, is not recognized in all browsers. The following source code is used to extract the event object instance regardless of browser used: evt = (evt) ? evt : ((event) ? event : null);
Visit our web design programs services for an affordable and reliable webhost to suit all your needs.

This entry was posted on Saturday, March 15th, 2008 at 8:30 am and is filed under Coldfusion. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

Leave a Reply