Working with Forms and Input Devices - JavaScript by Example - page 395

EXPLANATION ( CONTINUED )

3 If a radio button was checked, the checked property will return true .

4 If checked, the color of the background will be changed by assigning the value of

the radio button's value attribute to the bgColor property of the document.

5 The form is defined. It is named formradio .

6 The input type is a radio button, named color . Only one button can be selected

(see Figure 11.42). The value is a hexadecimal color code.

7 When the user clicks this button, the onClick event handler is triggered and the

handler function changeBg() is called, using the this keyword and the form object
as its argument.

Figure 11.42 Using radio buttons; only one can be checked.

Checkboxes. Although radio buttons can only be checked once, a user can check as
many checkboxes as he or she wants. When a checkbox is clicked, it is on, and when it
is not, it is off.
Checkboxes are created with the HTML <input type=“checkbox”> and are represented
in JavaScript as a checkbox object with specific properties and methods used to manipu-
late the object. Each checkbox is a property of the checkbox object and assigned to an
array of elements in the order in which they are placed in the form. The checked property
of the checkbox object specifies whether a box was checked. It returns true if checked,
and false if not.
To reach a value in the checkbox list, you could use, for example, docu-
ment.form1.check1 , where form1 is the name of the form, and check1 is the name of
the checkbox object. Figure 11.43 shows the JavaScript object hierarchy for the
checkbox object. Tables 11.19 and 11.20 list the properties and methods of the check-
box object.