Availability

JavaScript 1.0; enhanced in JavaScript 1.1

Inherits from/Overrides

Inherits from HTMLElement

Synopsis

form.elements[i] 
form.name

Properties

Input inherits properties from HTMLElement and defines or overrides the following:

checked

A read/write boolean that specifies whether a Checkbox or Radio form element is currently checked. You can set the state of these button elements by setting the value of this property. This property is not used by other form elements.

defaultChecked

A read-only boolean value that specifies whether a Checkbox or Radio element is checked by default. This property is used to restore the Checkbox or Radio element to its default value when the form is reset and has no meaning for other form elements. defaultChecked corresponds to the checked attribute in the HTML <input> tag that created the form element. If checked was present, defaultChecked is true. Otherwise, defaultChecked is false.

defaultValue

Specifies the initial text that appears in the form element and the value that is restored to that element when the form is reset. This property is used only by the Text, Textarea, and Password elements. For security reasons, it is not used by the FileUpload element. For Checkbox and Radio elements, the equivalent property is defaultChecked.

form

A read-only reference to the Form object that contains the element. The form property allows the event handlers of one form element to easily refer to sibling elements in the same form. When an event handler is invoked, the this keyword refers to the form element for which it was invoked. Thus, an event handler can use the expression this.form to refer to the form that contains it. From there, it can refer to sibling elements by name or use the elements[] array of the Form object to refer to them by number.

length

For the Select form element, this property specifies the number of options or choices (each represented by an Option object) that are contained within the options[] array of the element. See the Select reference page.

name

A read-only string, specified by the HTML name attribute, that specifies the name of this element. This name may be used to refer to the element, as shown in the preceding Section section. See the Input.name reference page.

options[]

For the Select form element, this array contains Option objects that represent the options or choices displayed by the Select object. The number of elements in the array is specified by the length property of the Select element. See the Input.name reference page.

selectedIndex

For the Select form element, this integer specifies which option displayed by the Select object is currently selected. In JavaScript 1.1, this property is read/write. In JavaScript 1.0, it is read-only. See the Input.name reference page.

type [ JavaScript 1.1]

A read-only string that specifies the type of the form element. See the Input.type reference page.

value

A string that specifies the value displayed by the element and/or to be sent to the server for this element when the form that contains it is submitted. See the Input.value reference page.

Methods

Input inherits methods from HTMLElement and defines or overrides the following:

blur( )

Removes keyboard focus from the element.

click( )

Simulates a mouse-click on the form element.

focus( )

Gives keyboard focus to the element.

select( )

For form elements that display editable text, selects the text that appears in the element.

Event Handlers

Input inherits event handlers from HTMLElement and defines or overrides the following:

onblur

Invoked when the user takes keyboard focus away from the element.

onchange

For form elements that are not buttons, this event handler is invoked when the user enters or selects a new value.

onclick

For form elements that are buttons, this event handler is invoked when the user clicks or selects the button.

onfocus

Invoked when the user gives keyboard focus to the element.

Description

Form elements are stored in the elements[] array of the Form object. The contents of this array are Input objects, which represent the individual buttons, input fields, and other controls that appear within the form. Many types of input elements are created with the <input> tag; others are created with the <select> and <option> tags and the <textarea> tag. The various form input elements share quite a few properties, methods, and event handlers, which are described on this reference page. Specific behaviors for specific types of form elements are described on their own pages.

The Input object defines many shared properties, methods, and event handlers, but not all of them are shared by all types of form elements. For example, the Button object triggers the onclick event handler but not the onchange handler, while the Text object triggers onchange but not onclick. The following figure shows all of the form elements and the properties associated with them.

There are two broad categories of form elements. The first is the buttons: Button, Checkbox, Radio, Reset, and Submit. These elements have an onclick event handler but not an onchange handler. Similarly, they respond to the click( ) method but not to the select( ) method. The second category contains those elements that display text: Text, Textarea, Password, and FileUpload. These elements have an onchange event handler rather than an onclick handler, and they respond to the select( ) method but not to the click( ) method.

The Select element is a special case. It is created with the <select> tag and is less like the <input> elements than the other form elements. Although the Select element is technically represented by a different object type, it is still convenient to consider it an Input object.

See Also

Button, Checkbox, FileUpload, Form, Hidden, Password, Radio, Reset, Select, Submit, Text, Textarea; Chapter 15; HTMLInputElement in the DOM reference section