Java Reference
In-Depth Information
}
return e.srcElement;
}
};
It follows the same pattern used in
addListener()
and
removeListener()
; it uses the
target
property
as a truthy/falsy value to determine if the browser supports the standard API. If
target
is supported, it
is returned. Otherwise, the function returns the element object contained within
srcElement
.
The fourth and final method is
preventDefault()
. The purpose of this method is to prevent the default
action of the event that took place (if such an action exists). It first checks for standards compliance
by determining if the supplied event object has a
preventDefault()
method. If so, it calls the method;
otherwise, it sets the event object's
returnValue
to false.
Before moving on, it's important to realize that this event utility object is based on an assumption:
If the browser doesn't support the standard event model, it must be old‐IE. Although this is a safe
assumption to make, it is not always 100 percent correct. Some old mobile browsers do not support
either the standard event model or old‐IE's event model. However, as Windows, Android, and
iOS mobile devices continue to gain market share, these old, non‐compliant mobile browsers are
vanishing from the market. In most cases, it's safe to ignore them.
Now that you have a utility for making it easier to write cross‐browser, event‐driven code, let's
revisit the previous examples and put it to use.
Start by modifying Example 10. Here's the revised code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Chapter 10, Example 14</title>
</head>
<body>
<a id="someLink" href="somepage.html">
Click Me
</a>
<script src="event‐utility.js"></script>
<script>
var link = document.getElementById("someLink");
function linkClick(e) {
alert("This link is going nowhere");
evt.preventDefault(e);
}
evt.addListener(link, "click", linkClick);
</script>
</body>
</html>
Save this as
ch10_example14.html
.
