input

FilterElements

HTML: <input>
XHTML: <input/>  or  <input />

The input element is used to create a variety of form input controls. The type of control is defined by the type attribute. Following is a complete list of attributes (with descriptions) that can be used with the input element. Not all attributes can be used with all control types. The attributes associated with each control type are listed below.

Notes

HTML5 adds a number of new values for the type attribute: datetime, datetime-local, date, month, week, time, number, range, email, url, search, and color. New HTML5 attributes for the input element are listed below.

Start/End Tags

This is an empty element. In HTML, the end tag is forbidden. In XHTML, the element must be closed with a trailing slash as just shown. Developers may include a space character before the slash for backward compatibility with older browsers.

Specifications

  • HTML 4.01
  • HTML5

accept=

Values: MIME type
Specifies a comma-separated list of content types that a server processing the form will handle correctly. It can be used to filter out nonconforming files when prompting a user to select files to send to the server.

accesskey=

Values: character
Assigns an access key (keyboard shortcut) to an element for quicker access.

align=

Values: bottom | left | middle | right | top
Deprecated. Not in HTML5. Specifies the alignment of an image.

alt=

Values: text
Specifies alternative text for an image used as a button.

autocomplete=

Values: on | off
HTML5 only. Allows the user agent (browser) to fill in a field automatically (on) or requires the user to enter the information every time (off). Omitting this attribute causes the control to inherit the autocomplete setting for the associated form element.

autofocus

Values: None in HTML. (autofocus="autofocus" in XHTML)
HTML5 only. Indicates the control should have focus (be highlighted and ready for user input) when the document loads.

checked

Values: None in HTML. (checked="checked" in XHTML)
When this attribute is added to a radio button or checkbox input, the input will be checked when the page loads.

disabled

Values: None in HTML. (disabled="disabled" in XHTML)
Disables the control for user input. It can be altered only via a script. Browsers may display disabled controls differently (grayed out, for example), which could be useful for dimming certain controls until required info is supplied.

form=

Values: id of the form owner
HTML5 only. Explicitly associates the input control with its associated form (its form owner). With this method, the input control does not need to be a child of the applicable form element.

formaction=

Values: URL
HTML5 only. Specifies the application that will process the form. It is used only with a submit button (type="submit" or "image") and has the same function as the action attribute for the form element.

formenctype=

Values: content type
HTML5 only. Specifies how the form values are encoded with the post method type. It is used only with a submit button (type="submit" or "image") and has the same function as the enctype attribute for the form element. The default is Internet Media Type (application/x-www-form-urlencoded). The value multipart/form-data should be used in combination with the file input type.

formmethod=

Values: get | post | put | delete
HTML5 only. Specifies which HTTP method will be used to submit the form data. It is used only with a submit button (type="submit" or "image") and has the same function as the method attribute for the form element. The put and delete values are new in HTML5.

formnovalidate

Values: None in HTML. (formnovalidate= formnovalidate  in XHTML5)
HTML5 only. Indicates that the form is not to be validated during submission. It is used only with a submit button (type="submit" or "image") and has the same function as the novalidate attribute for the form element (new in HTML5).

formtarget=

Values: name
HTML5 only. Specifies the target window for the form results. It is used only with a submit button (type="submit" or "image") and has the same function as the target attribute for the form element.

height=

Values: number of pixels
HTML5 only. Specifies the height of the button image when the input type is set to image.

ismap

Values: None in HTML. (ismap="ismap" in XHTML)
Not in HTML5. Indicates that the graphic is used as the basis for a server-side image map (an image containing multiple hypertext links). This attribute may be used with the “image” input type only.

list=

Values: id of datalist
HTML5 only. Indicates that the control has a list of predefined suggestions for the user, which are provided by a datalist element. The value of the list attribute is the id of the associated datalist.

max=

Values: number or string
HTML5 only. Specifies the upper boundary of the accepted value range for the element. The max value must not be less than the min value.

maxlength=

Values: number
Specifies the maximum number of characters the user can enter for input elements set to text, password, search, tel, or url.

min=

Values: number or string
HTML5 only. Specifies the lower boundary of the accepted value range for the element. The min value defines the base for step operations.

multiple

Values: None in HTML. (multiple="multiple" in XHTML)
HTML5 only. Indicates the user is allowed to specify more than one value.

name=

Values: text
Required by all input types except submit and reset. Assigns a name to the control; a script program uses this name to reference the control.

pattern=

Values: JavaScript regular expression
HTML5 only. Specifies a regular expression against which the control’s value is to be checked. This is useful for making sure user input matches the format of the expected value, for example, a telephone number or an email address. The title attribute can be used with pattern to provide a description of the expected pattern/format of the input.

placeholder=

Values: number
HTML5 only. Provides a short (one word or short phrase) hint or example to help the user enter the correct data or format. If a longer description is necessary, use the title attribute.

readonly

Values: None in HTML. (readonly="readonly" in XHTML)
Indicates that the form input may not be modified by the user.

required

Values: None in HTML. (required="required" in XHTML)
HTML5 only. When present, indicates the input value is required.

size=

Values: number
Specifies the width of a text-entry control (when type is set to text, password, or search), measured in number of characters. Users may type entries that are longer than the space provided, causing the field to scroll to the right.

src=

Values: URL
When the input type is image, this attribute provides the location of the image to be used as a push button.

step=

Values: any | number
HTML5 only. Indicates the granularity that is expected and required of the value by limiting the allowed value to permitted units. The value of this attribute is dependent on the type of the input control. It may be a number, a text string (such as a date), or the keyword any, which allows any unit value.

tabindex=

Values: number
Specifies position in the tabbing order. Tabbing navigation allows the user to cycle through the active fields using the Tab key.

type=

Values: text | password | checkbox | radio | submit | reset | file | hidden | image | button New in HTML5: date | datetime | datetime-local | email | month | number | range | tel | time | url | week
Specifies the data type and associated form control.

usemap=

Values: URL
Not in HTML5. Specifies the map containing coordinates and links for a client-side image map (an image containing multiple hypertext links). This attribute may be used with the “image” input type only.

value=

Values: text
Specifies the initial value for this control.

width=

Values: number of pixels
HTML5 only. Specifies the width of the bottom image when the input type is set to image.

HTML 4.01 <input> Events

onchange
Occurs when the element loses the input focus and its value has been modified since gaining focus
onselect
Occurs when text within the element is selected

See individual input types.