HTML <input> Element
The <input> element enables users to interact with a website by inputting data into an online form.
INPUT TYPES
The type attribute tells the browser what sort of form control to create and the type of input to expect. The types available are:
- text - a single line text input field is created the size of which is given by the size attribute (number of characters).
- password - creates a single line text input according to the size attribute which is hidden, usually by replacing the entered text with asterisks.
- checkbox - creates a check box which the user can click on to check(place a tick in the box). Can be preselected when the form loads by adding the checked attribute with a value of 'checked' i.e. 'checked="checked"'
- radio - creates a radio button which can be on or off(selected or not selected). As with a checkbox can be preselected with the checked attribute. NOTE: The difference between radio buttons and check boxes is that multiple check boxes sharing the same name can be ticked(selected) within a form but only one radio button in a group can be selected - all the others must be off.
- button - creates a push button and the value attribute contains the text within the button.
- file - creates a file upload control.
- submit - creates a submit button - when this button is 'pushed' the form information is submitted.
- reset - creates a reset button. When this button is clicked all the form controls are reset to their initial values.
- hidden - creates a control that doesn't appear on the screen but the values are sent with the form data on submission.
- image - creates a graphical submit button.
This is how the input types are displayed on the screen:
<input> Attributes
- CORE AND LANGUAGE ATTRIBUTES - class, id, title, style, dir, lang
- MOUSE AND KEYBOARD EVENT ATTRIBUTES - onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmouseout, onmousemove, onkeydown, onkeyup, onkeypress
- type - what type of input is expected.
- name - the name given to a specific input element.
- value - the initial value of this element.
- src - a URI location for form fields containing an image.
- alt - alternative text for browsers that dont support images.
- checked - sets a radio button or checkbox as selected.
- disabled - sets an input element as unavailable.
- readonly - cannot be modified by the user.
- size - sets a size for a form field.
- maxlength - sets the maximum number of characters that can be entered into this field.
- usemap - refers to a client-side image map.
- ismap - refers to a server-side image map.
- tabindex - gives the position of this element in the tabbing order.
- accesskey - sets a single key to access this element.
- onfocus - defines an event that occurs when the element gains focus.
- onblur - defines an event that occurs when an element loses focus.
- onselect - sets an event to occur when a user selects some text in a text field.
- onchange - sets an event to occur when the input element loses focus and it's value has been altered since gaining focus.
The <input> element has been altered considerably in HTML5 with the addition of new input types and attributes. For more details please see the
HTML5 input element page.
HTML 4 Element List
<!--<comment>--><!DOCTYPE><a><abbr><acronym><address><applet><area><b><base><basefont><bdo><big><blockquote><body><br><button><caption><center><cite><code><col><colgroup><dd><del><dfn><dir><div><dl><dt><em><fieldset><font><form><frame><frameset><head><h1> to <h6><hr><html><i><iframe><img> <input><ins><isindex><kbd><label><legend><li><link><map><menu><meta><noframes><noscript><object><ol><optgroup><option><p><param><pre><q><s><samp><script><select><small><span><strike><strong><style><sub><sup><table><tbody><td><textarea><tfoot><th><thead><title><tr><tt><u><ul><var>