HTML and CSS Reference
In-Depth Information
$(“li”).click(function () {
if (!$(this).hasClass(“highlighted”)) {
$(this).addClass(“highlighted”);
}
else {
alert(“This list item is already highlighted.”);
}
});
FIGURE 16.7
An alert is dis-
played when users
click a paragraph
the second time.
16
In this example, I use the
hasClass()
method to determine whether the class is already
present. If it isn't, I add it. If it is, I display the alert.
Manipulating Form Values
You can also use jQuery to modify the contents of form fields. The
val()
method can be
used to both retrieve the value of form fields and to modify them. In many cases, web-
sites put an example of the input that should be entered into a form field in the field until
the user enters data. In the following example, the form starts with example data in the
field, but it's removed automatically when the user focuses on the field. If the user
doesn't enter any data, the example data is restored. Figure 16.8 shows the initial state of
the page.
FIGURE 16.8
When the page
loads, the sample
content appears in
the form field.
