Web Development with jQuery®

(^56) ❘ CHAPTER 2 SELECTING AND FILTERING
That selection is then narrowed to exclude the elements that represent the remaining days of
last month, or the beginning days of next month, even though this particular example has none of
the days of the following month included because it ends evenly, fi lling all seven of the child spots
within the last element. These elements are excluded from the selection by using jQue-
ry’s not() method. The not() method takes an existing selection and subtracts from it using
a selector.
The not() method can also take the results of another jQuery selection, such as
.not($('td.calendarLastMonth, td.calendarNextMonth'))
It can also use direct DOM element objects, such as those returned from JavaScript methods such as
document.getElementById(). Finally, you can also use a callback function, which would return one
of the preceding, a jQuery selection, or a direct DOM element object reference. This same thing is
true of many jQuery API methods; where it makes sense and is possible, you can often use a jQuery
selection, which is an array of elements returned from jQuery, a direct DOM object reference, or a
callback function.
.not('td.calendarLastMonth, td.calendarNextMonth')
Having now excluded the elements you don’t want selectable in the current month, the remaining

elements each receive an onclick event via click() and jQuery’s event API, which I cover in
more detail in Chapter 3, “Events.”
.click(
function()
{
When a click occurs, the fi rst thing that you do is to use the selectedDay variable that you created to
keep track of the selected day. You fi rst see if you have stored a selection in this variable by checking
the length property. If you have stored a selection, that selection is used to remove the class name
calendarDaySelected from the last element that was given this class name, and you remove the
class name calendarWeekSelected from the last element to have received that class name. This
ensures that only one element has that class name with any given click, and is the only selected
day, and that element’s parent element is the only element to be the selected week. Sans
this logic, you would potentially be selecting many and many elements as the selected day
and week, respectively.
if (selectedDay && selectedDay.length)
{
selectedDay
.removeClass('calendarDaySelected')
.parent('tr')
.removeClass('calendarWeekSelected');
}
Following the selected day logic, you assign a variable called day with $(this), which is the element
currently experiencing the click event made jQuery-able.
var day = $(this);
[http://www.it-ebooks.info](http://www.it-ebooks.info)