Javascript Event Object

Properties

Different types of events have different properties, which you’ll learn
about later in the chapter. Here are a few properties common to all standard
Event objects:
■ type The type of the event, like “click,” “load,” or “keypress.”
■ target The element that originally dispatched the event. This may not
be the same as the element to which the event handler is attached.
■ currentTarget The element to which you attached the event handler.
In most cases, it is synonymous with the this keyword. If you change
the context of the event handler with call() or apply(), you can still
access the element with currentTarget.
■ eventPhase A number that indicates whether the event is currently
capturing (1), bubbling (3), or at the target element (2). Find out more
information in the “Event Bubbling and Capturing” section later in this
chapter.
■ timeStamp A number in seconds that represents the time at which the
event occurred.


<a id="link" href="http://www.google.com">Don't go to
Google</a>
var link = document.getElementById("link");
link.addEventListener("click", dontFollowLink, false);
function dontFollowLink(event) {
alert("Not going to " + this.href);
event.preventDefault();

}


In Internet Explorer, the Event object isn’t available as an argument
of the handler. Instead, it’s a property of window. To write crossbrowser
DOM Level 0 code, look for the Event object in both places.
function handler(event) {
event = event || window.event;
}
Related Posts:
  • Javascript Objects as Arguments You may want to write functions that take many arguments, some ofwhich are optional.function drawElement( color, border, width, height,left, top, zIndex) {// Make and display an element with these variables}drawElement("red"… Read More
  • Javascript Recursion Recursion is when a function calls itself. This is often useful in mathematics,such as fi nding the nth number in the Fibonacci series (1, 2, 3, 5,8, 13, 21…).function fi bonacci(n) {if ( n < 2 ) {return 1;} else {return … Read More
  • Javascript The + Operator The binary + operator adds numeric operands or concatenates string operands: 1 + 2 // => 3"hello" + " " + "there" // => "hello there""1" + "2" // => "12" When the values of both operands are numbers, or are both str… Read More
  • Javascript Making a simple MouseOver <a href="http://www.cit.cornell.edu"onMouseOver="document.logo.src='family.gif ' ; "onMouseOut ="document.logo.src='harry.gif ' ; " ><img name="logo" src="harry.gif " border=0></a> The onMouseOver and onM… Read More
  • JavaScript String Split Function split()The split() method splits (for lack of a better word) a string up into substrings and returns them in an array. It accepts a string or regular expression argument containing the delimiter at which the string will be b… Read More
  • JavaScript Popups <head><script type="text/javascript">function testPopup() {window.open( "http://www.google.com/" )}</script></head><body><form><input type="button" onClick="testPopup()" value="Click"&g… Read More
  • JavaScript Alert The JavaScript alert is a dialogue box that pops up and takes the focus away from the current window and forces the web browser to read the message. 1. <form> <input type="button" onclick= "alert('Are you sure you… Read More
  • Javascript Math object The Math object holds a set of constants and methods enabling more complex mathematical operations than the basic arithmetic operators var root = Math.sqrt(10); Constants Provided by the Math Object Property … Read More
  • JavaScript System Dialogs alert(),confirm(),prompt() The browser is capable of invoking system dialogs to display to the user through the alert(),confirm(), and prompt() methods. These dialogs are not related to the web page being displayedin the browser and do not contain HTM… Read More
  • JavaScript Redirect <script type="text/javascript"> window.location = "http://www.yoursite.com/" </script> … Read More
  • Javascript search search(regexp)The search() method is the same as indexOf() except that it takes aregular expression pattern instead of a substring. It also returns -1 if thepattern isn’t found."hello world".search(/[aeiou]/); // Find the fi… Read More
  • JavaScript and XML To demonstrate JavaScript, XML, and the DOM in action, let’s use Internet Explorer 5.5 or better to load an XML document containing our employee directory and see if we can manipulate it. First, to load in the document w… Read More
  • Javascript Image Objects Properties of Image Objects Property Description align Indicates the alignment of the image, usually “left” or “right.” alt The alternative text rendering for the image as set by the alt attribu… Read More
  • JavaScript Variables Variables store a value you can refer to later in the script. Variable namescan be nearly any valid identifi er. A JavaScript identifi er is a word thatcontains only letters, numbers, $, and _, and that doesn’t start with an… Read More
  • Javascript String Constructor String is the built-in object corresponding to the primitive string data type. It contains a very large number of methods for string manipulation and examination, substring extraction, and even conversion of strings to marke… Read More