Creates a single-line text entry control.
![]() |
HTML information
| Closing Tag | forbidden |
|---|---|
| CSS Display | inline |
DOM Information
Inheritance Hierarchy
Members
The input type=text object has these types of members:
Events
The input type=text object has these events.
| Event | Description |
|---|---|
| abort |
Fires when the user aborts the download. |
| activate |
Fires when the object is set as the active element. |
| beforeactivate |
Fires immediately before the object is set as the active element. |
| blur |
Fires when the object loses the input focus. |
| change |
Fires when the contents of the object or selection have changed. |
| click |
Fires when the user clicks the left mouse button on the object. |
| contextmenu |
Fires when the user clicks the right mouse button in the client area, opening the context menu. |
| dblclick |
Fires when the user double-clicks the object. |
| deactivate |
Fires when the activeElement is changed from the current object to another object in the parent document. |
| drag |
Fires on the source object continuously during a drag operation. |
| dragend |
Fires on the source object when the user releases the mouse at the close of a drag operation. |
| dragenter |
Fires on the target element when the user drags the object to a valid drop target. |
| dragleave |
Fires on the target object when the user moves the mouse out of a valid drop target during a drag operation. |
| dragover |
Fires on the target element continuously while the user drags the object over a valid drop target. |
| dragstart |
Fires on the source object when the user starts to drag a text selection or selected object. |
| drop |
Fires on the target object when the mouse button is released during a drag-and-drop operation. |
| error |
Fires when an error occurs during object loading. |
| focus |
Fires when the object receives focus. |
| focusin |
Fires for an element just prior to setting focus on that element. |
| focusout |
Fires for the current element with focus immediately after moving focus to another element. |
| input |
Occurs when the text content of an element is changed through the user interface. |
| keydown |
Fires when the user presses a key. |
| keypress |
Fires when the user presses an alphanumeric key. |
| load |
Fires immediately after the client loads the object. |
| mousedown |
Fires when the user clicks the object with either mouse button. |
| mouseenter |
Fires when the user moves the mouse pointer into the object. |
| mouseleave |
Fires when the user moves the mouse pointer outside the boundaries of the object. |
| mousemove |
Fires when the user moves the mouse over the object. |
| mouseout |
Fires when the user moves the mouse pointer outside the boundaries of the object. |
| mouseover |
Fires when the user moves the mouse pointer into the object. |
| mouseup |
Fires when the user releases a mouse button while the mouse is over the object. |
| onbeforedeactivate |
Fires immediately before the activeElement is changed from the current object to another object in the parent document. |
| onkeyup |
Fires when the user releases a key. |
| onselect |
Fires when the current selection changes. |
| readystatechange |
Fires when the state of the object has changed. |
| reset |
Fires when the user resets a form. |
| resize |
Fires when the size of the object is about to change. |
| scroll |
Fires when the user repositions the scroll box in the scroll bar on the object. |
Methods
The input type=text object has these methods.
| Method | Description |
|---|---|
| appendChild |
Appends an element as a child to the object. |
| applyElement |
Makes the element either a child or parent of another element. |
| blur |
Causes the element to lose focus and fires the onblur event. |
| clearAttributes |
Removes all attributes and values from the object. |
| click |
Simulates a click by causing the onclick event to fire. |
| cloneNode |
Copies a reference to the object from the document hierarchy. |
| compareDocumentPosition |
Compares the position of two nodes in a document. |
| componentFromPoint |
Returns the component located at the specified coordinates via certain events. |
| contains |
Checks whether the given element is contained within the object. |
| createTextRange |
Creates a TextRange object for the element. |
| doScroll |
Simulates a click on a scroll bar component. |
| dragDrop |
Initiates a drag event. |
| focus |
Causes the element to receive the focus and executes the code specified by the onfocus event. |
| getAdjacentText |
Returns the adjacent text string. |
| getAttribute |
Retrieves the value of the specified attribute. |
| getAttributeNode |
Retrieves an attribute object referenced by the attribute.name property. |
| getAttributeNodeNS |
Gets an attribute object that matches the specified namespace and name. |
| getAttributeNS |
Gets the value of the specified attribute within the specified namespace. |
| getBoundingClientRect |
Retrieves an object that specifies the bounds of a collection of TextRectangle objects. |
| getClientRects |
Retrieves a collection of rectangles that describes the layout of the contents of an object or range within the client. Each rectangle describes a single line. |
| getElementsByClassName |
Gets a collection of objects that are based on the value of the class attribute. |
| getElementsByTagNameNS |
Gets a collection of objects that are based on the specified element names within a specified namespace. |
| hasAttribute |
Determines whether an attribute with the specified name exists. |
| hasAttributeNS |
Determines whether an attribute that has the specified namespace and name exists. |
| hasAttributes |
Determines whether one or more attributes exist for the object. |
| hasChildNodes |
Returns a value that indicates whether the object has children. |
| insertAdjacentElement |
Inserts an element at the specified location. |
| insertAdjacentHTML |
Inserts the given HTML text into the element at the location. |
| insertAdjacentText |
Inserts the given text into the element at the specified location. |
| insertBefore |
Inserts an element into the document hierarchy as a child node of a parent object. |
| isDefaultNamespace |
Indicates whether or not a namespace is the default namespace for a document. |
| isEqualNode |
Determines if two nodes are equal. |
| isSameNode |
Determines if two node references refer to the same node. |
| isSupported |
Returns a value indicating whether or not the object supports a specific DOM standard. |
| lookupNamespaceURI |
Gets the URI of the namespace associated with a namespace prefix, if any. |
| lookupPrefix |
Gets the namespace prefix associated with a URI, if any. |
| mergeAttributes |
Copies all read/write attributes to the specified element. |
| msMatchesSelector |
Determines whether an object matches the specified selector. |
| normalize |
Merges adjacent DOM objects to produce a normalized document object model. |
| querySelector |
Retrieves the first DOM element node from descendants of the starting element node that match any selector within the supplied selector string. |
| querySelectorAll |
Retrieves all DOM element nodes from descendants of the starting element node that match any selector within the supplied selector strings. |
| releaseCapture |
Removes mouse capture from the object in the current document. |
| removeAttribute |
Removes an attribute from an object. |
| removeAttributeNode |
Removes an attribute object from the object. |
| removeAttributeNS |
Removes the specified attribute from the object. |
| removeChild |
Removes a child node from the object. |
| removeNode |
Removes the object from the document hierarchy. |
| replaceAdjacentText |
Replaces the text adjacent to the element. |
| replaceChild |
Replaces an existing child element with a new child element. |
| replaceNode |
Replaces the object with another element. |
| scrollIntoView |
Causes the object to scroll into view, aligning it either at the top or bottom of the window. |
| select |
Highlights the input area of a form element. |
| setActive |
Sets the object as active without setting focus to the object. |
| setAttribute |
Sets the value of the specified attribute. |
| setAttributeNode |
Sets an attribute object node as part of the object. |
| setAttributeNodeNS |
Sets an attribute object as part of the object. |
| setAttributeNS |
Sets the value of the specified attribute within the specified namespace. |
| setCapture |
Sets the mouse capture to the object that belongs to the current document. |
| setSelectionRange |
Sets the start and end positions of a selection in a text field. |
| swapNode |
Exchanges the location of two objects in the document hierarchy. |
Properties
The input type=text object has these properties.
| Property | Description |
|---|---|
|
Sets or retrieves the access key for the object. | |
|
Specifies whether the element and its contents must be selected as a whole, indivisible unit. | |
|
Retrieves a collection of attributes of the object. | |
|
This property is not supported for Windows Store apps using JavaScript. | |
|
Gets a value indicating whether the object can contain child objects. | |
|
Retrieves the value indicating whether the object can contain rich HTML markup. | |
|
Retrieves the number of immediate child nodes of the current element or a zero if the element does not contain any child nodes. childElementCount does not return all child nodes, only child nodes that are nodeType =1, or element nodes. | |
|
Sets or retrieves the class of the object. | |
|
Retrieves the height of the object including padding, but not including margin, border, or scroll bar. | |
|
Retrieves the distance between the offsetLeft property and the true left side of the client area. | |
|
Retrieves the distance between the offsetTop property and the true top of the client area. | |
|
Retrieves the width of the object including padding, but not including margin, border, or scroll bar. | |
|
Sets or retrieves the string that indicates whether the user can edit the content of the object. | |
|
Sets or retrieves a field of a given data source, as specified by the dataSrc property, to bind to the specified object. | |
|
Sets or retrieves the source of the data for data binding. | |
|
Sets or retrieves the initial contents of the object. | |
|
Sets or retrieves the reading order of the object. | |
|
Sets or retrieves a value that indicates whether the user can interact with the object. | |
|
Gets a reference to the first child in the childNodes collection of the object. | |
|
Retrieves a reference to the first child element, or NULL if there are no child elements. | |
|
Retrieves a reference to the form that the object is embedded in. | |
|
Sets or gets the value that indicates whether the object visibly shows that it has focus. | |
|
Sets or retrieves the string identifying the object. | |
|
Sets or retrieves the HTML between the start and end tags of the object. | |
|
Sets or retrieves the text between the start and end tags of the object. | |
|
Gets the value that indicates whether the user can edit the contents of the object. | |
|
Gets the value that indicates whether the user can interact with the object. | |
|
Retrieves the value indicating whether the content of the object contains one or more lines. | |
|
Retrieves whether a TextRange object can be created using the object. | |
|
Sets or retrieves the language to use. | |
|
Gets a reference to the last child in the childNodes collection of an object. | |
|
Retrieves a reference to the last child element or NULL if there are no child elements. | |
|
Retrieves the local name of the fully qualified XML declaration for a node. | |
|
Sets or retrieves the maximum number of characters that the user can enter in a text control. | |
|
Sets or retrieves the name of the object. | |
|
Retrieves the namespace URI of the fully qualified XML declaration for a node. | |
|
Retrieves a reference to the sibling element that immediately follows or NULL if the element does not have any sibling elements that follow it. | |
|
Retrieves a reference to the next child of the parent for the object. | |
|
Gets the name of a particular type of node. | |
|
Retrieves the type of the requested node. | |
|
Gets or sets the value of a node. | |
|
Retrieves the height of the object relative to the layout or coordinate parent, as specified by the offsetParent property. | |
|
Retrieves the calculated left position of the object relative to the layout or coordinate parent, as specified by the offsetParent property. | |
|
Retrieves a reference to the container object that defines the offsetTop and offsetLeft properties of the object. | |
|
Retrieves the calculated top position of the object relative to the layout or coordinate parent, as specified by the offsetParent property. | |
|
Retrieves the width of the object relative to the layout or coordinate parent, as specified by the offsetParent property. | |
|
Sets or retrieves the object and its content in HTML. | |
|
Sets or retrieves the text of the object. | |
|
Retrieves the document object associated with the node. | |
|
Retrieves the parent object in the object hierarchy. | |
|
Retrieves the parent object in the document hierarchy. | |
|
Retrieves the container object in the document hierarchy that can be used to create a TextRange containing the original object. | |
|
Retrieves the local name of the fully qualified XML declaration for a node. | |
|
Retrieves a reference to the immediately preceding sibling element or NULL if the element does not have any preceding siblings. | |
|
Gets a reference to the previous child of the parent for the object. | |
|
Retrieves a value that indicates the current state of the object. | |
|
Sets or retrieves the role for this element. | |
|
Retrieves the scrolling height of the object. | |
|
Sets or retrieves the distance between the left edge of the object and the leftmost portion of the content currently visible in the window. | |
|
Sets or retrieves the distance between the top of the object and the topmost portion of the content currently visible in the window. | |
|
Retrieves the scrolling width of the object. | |
|
Gets or sets the end position or offset of a text selection. | |
|
Gets or sets the starting position or offset of a text selection. | |
|
Retrieves the ordinal position of the object, in source order, as the object appears in the document's all collection. | |
|
Specifies whether spell checking is applied to an editable text field. | |
|
Sets an inline style for the element. | |
|
Sets or retrieves the index that defines the tab order for the object. | |
|
Retrieves the tag name of the object. | |
|
Sets or retrieves the text content of an object and any child objects. | |
|
Sets or retrieves advisory information (a ToolTip) for the object. | |
|
Retrieves or initially sets the type of input control represented by the object. | |
|
Retrieves an autogenerated, unique identifier for the object. | |
|
Retrieves the element's unique number. | |
|
Sets or retrieves the displayed value for the control object. This value is returned to the server when the control object is submitted. | |
|
Sets or retrieves the |
Standards information
- HTML 4.01 Specification, Section 17.4
Remarks
The size attribute sets the number of visible characters in the input type=text element. The maxlength attribute sets the maximum number of characters that can be entered.
Security Warning: Using this object incorrectly can compromise the security of your application. When submitting text through input type=text over an intranet or the Internet, validating the text string is recommended. For instance, you might validate the string for a restricted set of known, good values (such as letters and numbers) and ignore the rest. You should review the Security Considerations: Dynamic HTML before continuing.
Note For more code samples, see Form controls part 1 and Form controls part 2: validation on the a Windows Store app using JavaScript sample site.
Examples
This example uses the input type=text element to create an empty text control that can contain 15 characters without requiring the user to scroll to read all of the text.
<input type="text" value="" name="textbox" size="15">
This example uses script to detect the content of the text box and display it in a dialog box.
<script type="text/javascript">
function detectEntry()
{
console.log("Your name is " + textbox.value)
}
</script>
See also
- Reference
- spellcheck
- input
- textArea
Build date: 11/28/2012
