HTML and CSS Reference
In-Depth Information
• :checkbox
• :file
• :button
for instance, this selects all
text
input fields:
> $(':text')
One of the nice features about jQuery filters is that you can actually write your own. For
instance, jQuery does not provide a filter for finding all the
date
input types. We can there-
fore add a custom filter to our code-base as follows:
> jQuery.expr[':'].date = function(elem) {
return jQuery(elem).is( "input" ) && $( elem ).attr( "type" ) === "date";
}
(Don't worry if this code looks unfamiliar, it will look familiar by the end of the chapter.)
When executed, this will be passed all elements in the document (or the specified sub-tree
of the document), and returns true or false depending on whether the specified element
meets the selection criteria. The result to the caller is all the elements that evaluated to true.
//
This function takes advantage of the jQuery
is
function. The
is
function is
slightly unusual in that it returns
true
or
false
rather than a set of elements.
Once this has been added to the code-base, the following pseudo class can be used:
> $(':date')
Now that we have investigated the five main selection mechanisms, the next step is to un-
derstand how these mechanisms can be combined. We have already been briefly introduced
to this concept with pseudo-classes.
The simplest way of combining filters is in cases where elements need to meet two or more
selection criteria. For instance, if the
:text
filter did not exist, it could be written through
the combination of two selection criteria. In the first instance, we would need to make sure
the element was of type
input
:
> $('input')
Additionally, the element must have an attribute called
type
set to the value
text
:
> $('[type="text"]')
