jQuery in Action
116
CHAPTER 4
Events are where it happens!
Inspecting the
HTML
structure of each appetizer entry allows us to concoct a
selector that matches the
<div>
elements and to use the
hide()
command on
them as follows:
$('fieldset div div').hide();
NOTE
We could initially hide these elements with
CSS
, but doing so in script
ensures that users who turn off JavaScript (yes, there are still people who
do that) will get a usable interface, albeit at the price of some computation
load when the page is displayed. There are other reasons to do the hiding
in the ready handler that we'll discuss in chapter 5 when we examine
wrapper methods like
do that) will get a usable interface, albeit at the price of some computation
load when the page is displayed. There are other reasons to do the hiding
in the ready handler that we'll discuss in chapter 5 when we examine
wrapper methods like
hide()
in greater detail.
Having tucked the appetizer options away for later display, we now turn our
attention to enabling the usability behaviors that we want the elements to exhibit.
Let's start by tying the display of the radio button options associated with an
appetizer to whether that appetizer is checked or not.
attention to enabling the usability behaviors that we want the elements to exhibit.
Let's start by tying the display of the radio button options associated with an
appetizer to whether that appetizer is checked or not.
To react to a change in the state of an appetizer check box, which should trig-
ger the change in visibility of the
<div>
element containing its options, we establish
Custom attributes: heroic or heinous?
The use of custom attributes to adorn DOM elements with attributes not defined by
the HTML or XHTML Specifications is a practice that has both its supporters and
detractors. To some, it's a useful leveraging of the tools that HTML and the brows-
ers make available to us; to others, it's an affront to all that is good because using
custom attributes can prevent the page from passing validation testing.
the HTML or XHTML Specifications is a practice that has both its supporters and
detractors. To some, it's a useful leveraging of the tools that HTML and the brows-
ers make available to us; to others, it's an affront to all that is good because using
custom attributes can prevent the page from passing validation testing.
Your authors take no sides on this issue and leave it to you, the reader, to deter-
mine whether you think that using custom attributes is a useful mechanism or a
wart on the face of a page.
mine whether you think that using custom attributes is a useful mechanism or a
wart on the face of a page.
Without the use of the attribute, the price data could be stored in a JavaScript vari-
able containing an object hash that associates an appetizer name (
able containing an object hash that associates an appetizer name (
imperial
, for
example) with its price.
The custom attribute tactic can be said to be advantageous over the JavaScript
variable mechanism because adding new appetizer entries means adding a new,
self-contained construct to the page without having to remember to update the
object hash with the price of added appetizers.
variable mechanism because adding new appetizer entries means adding a new,
self-contained construct to the page without having to remember to update the
object hash with the price of added appetizers.
Again, we leave it to you to determine which approach you feel suits you best.