O'Reilly logo

Programming Social Applications by Jonathan LeBlanc

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Attaching Events

As we discussed briefly in the section Bunch SET methods, there are methods available to help you easily and quickly fetch a node, or series of nodes, and attach event handlers to the bunch object that is returned. These methods are the query method, q(), to fetch the nodes, and the event attach method, on(), to insert the events:

//get node through the query method
var bunch = dom.q("QUERY");

//attach event onto the returned bunch object
bunch.on("EVENT", function(e){ ... }

In this example, we can see how to attach a click handler to a submit button to pop up an alert message:

var objSubmit = dom.q("#btnSubmit");
objSubmit.on("click", function(e){
   alert("You have just clicked the button - you win a prize");
});

The click event is just one of many DOM events that are supported through the event attach method. If we explore the full list of available events shown in Table 8-12, we see that there are several user-initiated features that we can account for in our programs.

Table 8-12. DOM events supported through the event attach method

Event

Description

blur

The focus on the element has been lost.

change

The user has changed the value of an input, select, or textarea field.

click

The user has clicked on the object with her mouse.

doubleclick

The user has clicked on the object twice with her mouse.

enterkey

The user has pressed the Enter key while in a focused element.

escapekey

The user has pressed the Escape key while in a focused element.

focus

The user has given an object focus.

keypress ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required