pub struct Input<'life> {Show 65 fields
pub accept: Option<AttributeValue<'life>>,
pub accesskey: Option<AttributeValue<'life>>,
pub alt: Option<AttributeValue<'life>>,
pub autocapitalize: Option<AttributeValue<'life>>,
pub autocomplete: Option<AttributeValue<'life>>,
pub autofocus: Option<AttributeValue<'life>>,
pub capture: Option<AttributeValue<'life>>,
pub checked: Option<AttributeValue<'life>>,
pub class: Option<AttributeValue<'life>>,
pub contenteditable: Option<AttributeValue<'life>>,
pub contextmenu: Option<AttributeValue<'life>>,
pub data: BTreeMap<&'life str, AttributeValue<'life>>,
pub dir: Option<AttributeValue<'life>>,
pub dirname: Option<AttributeValue<'life>>,
pub disabled: Option<AttributeValue<'life>>,
pub draggable: Option<AttributeValue<'life>>,
pub enterkeyhint: Option<AttributeValue<'life>>,
pub exportparts: Option<AttributeValue<'life>>,
pub extra: BTreeMap<&'life str, AttributeValue<'life>>,
pub form: Option<AttributeValue<'life>>,
pub formaction: Option<AttributeValue<'life>>,
pub formenctype: Option<AttributeValue<'life>>,
pub formmethod: Option<AttributeValue<'life>>,
pub formnovalidate: Option<AttributeValue<'life>>,
pub formtarget: Option<AttributeValue<'life>>,
pub height: Option<AttributeValue<'life>>,
pub hidden: Option<AttributeValue<'life>>,
pub id: Option<AttributeValue<'life>>,
pub inert: Option<AttributeValue<'life>>,
pub inputmode: Option<AttributeValue<'life>>,
pub is: Option<AttributeValue<'life>>,
pub itemid: Option<AttributeValue<'life>>,
pub itemprop: Option<AttributeValue<'life>>,
pub itemref: Option<AttributeValue<'life>>,
pub itemscope: Option<AttributeValue<'life>>,
pub itemtype: Option<AttributeValue<'life>>,
pub lang: Option<AttributeValue<'life>>,
pub list: Option<AttributeValue<'life>>,
pub max: Option<AttributeValue<'life>>,
pub maxlength: Option<AttributeValue<'life>>,
pub min: Option<AttributeValue<'life>>,
pub minlength: Option<AttributeValue<'life>>,
pub multiple: Option<AttributeValue<'life>>,
pub name: Option<AttributeValue<'life>>,
pub nonce: Option<AttributeValue<'life>>,
pub part: Option<AttributeValue<'life>>,
pub pattern: Option<AttributeValue<'life>>,
pub placeholder: Option<AttributeValue<'life>>,
pub popover: Option<AttributeValue<'life>>,
pub readonly: Option<AttributeValue<'life>>,
pub required: Option<AttributeValue<'life>>,
pub role: Option<AttributeValue<'life>>,
pub size: Option<AttributeValue<'life>>,
pub slot: Option<AttributeValue<'life>>,
pub spellcheck: Option<AttributeValue<'life>>,
pub src: Option<AttributeValue<'life>>,
pub step: Option<AttributeValue<'life>>,
pub style: Option<AttributeValue<'life>>,
pub tabindex: Option<AttributeValue<'life>>,
pub title: Option<AttributeValue<'life>>,
pub translate: Option<AttributeValue<'life>>,
pub type_: Option<AttributeValue<'life>>,
pub value: Option<AttributeValue<'life>>,
pub virtualkeyboardpolicy: Option<AttributeValue<'life>>,
pub width: Option<AttributeValue<'life>>,
}
Expand description
The <input>
HTML element is used to create interactive controls for web-based forms in order to accept data from the user; a wide variety of types of input data and control widgets are available, depending on the device and user agent. The <input>
element is one of the most powerful and complex in all of HTML due to the sheer number of combinations of input types and attributes.
More information: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input
Fields§
§accept: Option<AttributeValue<'life>>
Valid for the file
input type only, the accept
attribute defines which file types are selectable in a file
upload control. See the file input type.
accesskey: Option<AttributeValue<'life>>
Provides a hint for generating a keyboard shortcut for the current element. This attribute consists of a space-separated list of characters. The browser should use the first one that exists on the computer keyboard layout.
alt: Option<AttributeValue<'life>>
Valid for the image
button only, the alt
attribute provides alternative text for the image, displaying the value of the attribute if the image src
is missing or otherwise fails to load. See the image input type.
autocapitalize: Option<AttributeValue<'life>>
Controls whether and how text input is automatically capitalized as it is entered/edited by the user. It can have the following values:
off
ornone
, no autocapitalization is applied (all letters default to lowercase)on
orsentences
, the first letter of each sentence defaults to a capital letter; all other letters default to lowercasewords
, the first letter of each word defaults to a capital letter; all other letters default to lowercasecharacters
, all letters should default to uppercase
autocomplete: Option<AttributeValue<'life>>
(Not a Boolean attribute!) The autocomplete
attribute takes as its value a space-separated string that describes what, if any, type of autocomplete functionality the input should provide. A typical implementation of autocomplete recalls previous values entered in the same input field, but more complex forms of autocomplete can exist. For instance, a browser could integrate with a device's contacts list to autocomplete email
addresses in an email input field. See autocomplete
for permitted values.
The autocomplete
attribute is valid on hidden
, text
, search
, url
, tel
, email
, date
, month
, week
, time
, datetime-local
, number
, range
, color
, and password
. This attribute has no effect on input types that do not return numeric or text data, being valid for all input types except checkbox
, radio
, file
, or any of the button types.
See the autocomplete
attribute for additional information, including information on password security and how autocomplete
is slightly different for hidden
than for other input types.
autofocus: Option<AttributeValue<'life>>
A Boolean attribute which, if present, indicates that the input should automatically have focus when the page has finished loading (or when the <dialog>
containing the element has been displayed).
Note: An element with the autofocus
attribute may gain focus before the DOMContentLoaded
event is fired.
No more than one element in the document may have the autofocus
attribute. If put on more than one element, the first one with the attribute receives focus.
The autofocus
attribute cannot be used on inputs of type hidden
, since hidden inputs cannot be focused.
Warning: Automatically focusing a form control can confuse visually-impaired people using screen-reading technology and people with cognitive impairments. When autofocus
is assigned, screen-readers "teleport" their user to the form control without warning them beforehand.
Use careful consideration for accessibility when applying the autofocus
attribute. Automatically focusing on a control can cause the page to scroll on load. The focus can also cause dynamic keyboards to display on some touch devices. While a screen reader will announce the label of the form control receiving focus, the screen reader will not announce anything before the label, and the sighted user on a small device will equally miss the context created by the preceding content.
capture: Option<AttributeValue<'life>>
Introduced in the HTML Media Capture specification and valid for the file
input type only, the capture
attribute defines which media—microphone, video, or camera—should be used to capture a new file for upload with file
upload control in supporting scenarios. See the file input type.
checked: Option<AttributeValue<'life>>
Valid for both radio
and checkbox
types, checked
is a Boolean attribute. If present on a radio
type, it indicates that the radio button is the currently selected one in the group of same-named radio buttons. If present on a checkbox
type, it indicates that the checkbox is checked by default (when the page loads). It does not indicate whether this checkbox is currently checked: if the checkbox's state is changed, this content attribute does not reflect the change. (Only the HTMLInputElement
's checked
IDL attribute is updated.)
Note: Unlike other input controls, a checkboxes and radio buttons value are only included in the submitted data if they are currently checked
. If they are, the name and the value(s) of the checked controls are submitted.
For example, if a checkbox whose name
is fruit
has a value
of cherry
, and the checkbox is checked, the form data submitted will include fruit=cherry
. If the checkbox isn't active, it isn't listed in the form data at all. The default value
for checkboxes and radio buttons is on
.
class: Option<AttributeValue<'life>>
A space-separated list of the classes of the element. Classes allow CSS and JavaScript to select and access specific elements via the class selectors or functions like the method Document.getElementsByClassName()
.
contenteditable: Option<AttributeValue<'life>>
An enumerated attribute indicating if the element should be editable by the user. If so, the browser modifies its widget to allow editing. The attribute must take one of the following values:
true
or the empty string, which indicates that the element must be editable;false
, which indicates that the element must not be editable.
data: BTreeMap<&'life str, AttributeValue<'life>>
Forms a class of attributes, called custom data attributes, that allow proprietary information to be exchanged between the HTML and its DOM representation that may be used by scripts. All such custom data are available via the HTMLElement
interface of the element the attribute is set on. The HTMLElement.dataset
property gives access to them.
dir: Option<AttributeValue<'life>>
An enumerated attribute indicating the directionality of the element's text. It can have the following values:
ltr
, which means left to right and is to be used for languages that are written from the left to the right (like English);rtl
, which means right to left and is to be used for languages that are written from the right to the left (like Arabic);auto
, which lets the user agent decide. It uses a basic algorithm as it parses the characters inside the element until it finds a character with a strong directionality, then it applies that directionality to the whole element.
dirname: Option<AttributeValue<'life>>
<p>Valid for <code>text</code> and <code>search</code> input types only, the <code>dirname</code> attribute enables the submission of the directionality of the element. When included, the form control will submit with two name/value pairs: the first being the <a href="#name"><code>name</code></a> and <a href="#value"><code>value</code></a>, the second being the value of the <code>dirname</code> as the name with the value of <code>ltr</code> or <code>rtl</code> being set by the browser.</p>
<div class="code-example"><pre class="brush: html notranslate"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>form</span> <span class="token attr-name">action</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>page.html<span class="token punctuation">"</span></span> <span class="token attr-name">method</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>post<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
<label >Fruit: <input type=“text” name=“fruit” dirname=“fruit.dir” value=“cherry” /> </label> <input type=“submit” /> </form> <!– page.html?fruit=cherry&fruit.dir=ltr –>
When the form above is submitted, the input cause both the name
/ value
pair of fruit=cherry
and the dirname
/ direction pair of fruit.dir=ltr
to be sent.