HTML and CSS Reference
In-Depth Information
to refer to the jQuery library, your development machine must have Internet connectivity. You can, of
course, use a local copy of the jQuery library during development and switch to the Microsoft Ajax CDN
once the application goes into production.
Now that you know how to refer to the jQuery library in your ASP.NET web applications, let's examine
the core features of jQuery in the sections to come.
Event Handling
Handling events raised by HTML page elements such as buttons, lists, and images is one of the most
frequently programmed operations in client-side scripts. jQuery offers an easy and cross-browser event-
handling mechanism that allows you to wire event handlers on the fly and also provides rich information
about the event being handled.
Table 2-1 lists many of the commonly used client-side events in web applications.
Table 2-1.
Commonly Used Client-Side Events in Web Applications
Event
Description
blur
Occurs when focus leaves an element
change
Occurs when the value of
<input>
,
<textarea>
, and or
<select>
changes.
click
Occurs when the user clicks an element.
dblclick
Occurs when the user double-clicks an element.
focus
Occurs when an element receives focus.
hover
Allows you to trap mouse entry and exit from an element.
keydown
Occurs when a keyboard key is pressed but is yet to be released.
keypress
Occurs when any of the input key is pressed. Normally used when you're only interested in
data entered and not in the state of the Shift or Ctrl key.
keyup
Occurs when a keyboard key is released.
mousedown
Occurs when a mouse button is pressed but not yet released.
mouseup
Occurs when a pressed mouse button is released.
select
Occurs when text is selected from
<input>
or
<textarea>
.
submit
Occurs when a form is being submitted. Valid only on
<form>
elements.
To handle the events in Table 2-1, jQuery offers a set of corresponding functions. These functions
serve a dual purpose:
• They let you specify an event-handler function that should be executed when the
event is raised.
• They let you trigger the event programmatically.
For example, to wire an event-handler function named
OnClick
to the
click
event of a button whose
ID is
Button1
, you write
$("#Button1").click(OnClick);
On the other hand, if you wish to programmatically trigger the
click
event of
Button1
, you write:
$("#Button1").click();
This dual purpose will be clearer when you use it in the example developed in this section.