HTMLInputElement
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
HTMLInputElement
接口提供了特定的属性和方法,用于管理 <input>
元素的选项、布局和外观。
实例属性
还从其父接口 HTMLElement
继承属性。
某些属性仅适用于支持相应属性的输入元素类型。
align
已弃用-
一个表示元素对齐方式的字符串。请改用 CSS。
defaultValue
-
一个表示元素默认值的字符串,该值最初是在创建此对象的 HTML 中指定的。
dirName
-
一个表示元素方向的字符串。
incremental
非标准-
一个表示搜索事件触发模式的布尔值,如果为
true
,则在每次按键或单击取消按钮时触发;否则在按下 Enter 键时触发。 labels
只读-
返回一个
<label>
元素的列表,这些元素是当前元素的标签。 list
只读-
返回由
list
属性指向的元素。如果在同一树中找不到 HTML 元素,则该属性可能为null
。 multiple
-
一个表示元素的
multiple
属性的布尔值,表示是否可能有多个值(例如,多个文件)。 name
-
一个表示元素的
name
属性的字符串,包含在提交表单时标识元素的名称。 popoverTargetAction
-
获取或设置要在由
type="button"
的<input>
元素控制的弹出窗口元素上执行的操作("hide"
、"show"
或"toggle"
)。它反映了popovertargetaction
HTML 属性的值。 popoverTargetElement
-
获取或设置要通过
type="button"
的<input>
元素控制的弹出窗口元素。它反映了popovertarget
HTML 属性的值。 step
-
一个表示元素的
step
属性的字符串,它与min
和max
一起使用,以限制可以设置数字或日期时间值的增量。它可以是字符串any
或正浮点数。如果不设置为any
,则控件仅接受大于最小值的步长值的倍数。 type
useMap
已弃用-
一个表示客户端图像映射的字符串。
value
-
一个表示控件当前值的字符串。如果用户输入与预期不同的值,则可能返回空字符串。
valueAsDate
-
一个表示元素的值的
Date
,以日期形式解释,如果无法转换,则为null
。 valueAsNumber
-
一个表示元素的值的数字,以以下顺序解释:时间值、数字或
NaN
(如果无法转换)。
与父表单相关的实例属性
form
只读-
返回一个父表单(
<form>
)元素的引用。 formAction
-
一个表示元素的
formaction
属性的字符串,包含处理元素提交信息程序的 URI。这会覆盖父表单的action
属性。 formEnctype
-
一个表示元素的
formenctype
属性的字符串,包含将表单提交到服务器的内容类型。这会覆盖父表单的enctype
属性。 formMethod
-
一个表示元素的
formmethod
属性的字符串,包含浏览器用于提交表单的 HTTP 方法。这会覆盖父表单的method
属性。 formNoValidate
-
一个表示元素的
formnovalidate
属性的布尔值,表示在提交表单时不对其进行验证。这会覆盖父表单的novalidate
属性。 formTarget
-
一个表示元素的
formtarget
属性的字符串,包含一个名称或关键字,表示在提交表单后接收响应的显示位置。这会覆盖父表单的target
属性。
适用于任何类型的非隐藏输入元素的实例属性
disabled
-
一个表示元素的
disabled
属性的布尔值,表示该控件不可用于交互。输入值将不会与表单一起提交。参见readonly
。 required
-
一个表示元素的
required
属性的布尔值,表示用户必须在提交表单之前填写值。 validationMessage
只读-
返回一条描述控件不满足时的验证约束的本地化消息。如果控件不是约束验证的候选项(
willValidate
为false
),或者它满足其约束,则为空字符串。此值可以通过setCustomValidity()
方法设置。 validity
只读-
返回元素当前的有效状态。
willValidate
只读-
返回元素是否是约束验证的候选项。如果任何条件阻止它进行约束验证,则为
false
,包括:它的type
是hidden
、reset
或button
之一,它的祖先中有<datalist>
或者它的disabled
属性为true
。
仅适用于复选框和单选按钮元素的实例属性
checked
-
一个表示元素当前状态的布尔值。
defaultChecked
-
一个表示单选按钮或复选框的默认状态的布尔值,该值最初是在创建此对象的 HTML 中指定的。
indeterminate
-
一个表示复选框或单选按钮是否处于不确定状态的布尔值。对于复选框,效果是复选框的外观被某种方式遮挡/变灰,以表示其状态是不确定的(既不选中也不未选中)。不会影响
checked
属性的值,单击复选框将其值设置为假。
仅适用于图像类型的元素的实例属性
仅适用于文件类型的元素的实例属性
accept
-
一个表示元素的
accept
属性的字符串,包含可以选择的文件类型的以逗号分隔的列表。 files
-
一个
FileList
,表示选择的要上传的文件。 webkitdirectory
-
一个表示
webkitdirectory
属性的布尔值。如果为true
,则文件系统选择器接口仅接受目录而不是文件。 webkitEntries
只读-
描述当前选择的文件或目录。
仅适用于包含文本或数字的可见元素的实例属性
autocomplete
-
一个表示元素的
autocomplete
属性的字符串,表示控件的值是否可以由浏览器自动填充。 capture
-
一个表示元素的
capture
属性的字符串,指示文件上传控件中的媒体捕获输入方法。 max
maxLength
-
一个表示元素的
maxlength
属性的数字,包含值可以具有的最大字符数(以 Unicode 码点表示)。 min
minLength
-
一个表示元素的
minlength
属性的数字,包含值可以具有的最小字符数(以 Unicode 码点表示)。 pattern
-
一个表示元素的
pattern
属性的字符串,包含要检查控件值的正则表达式。使用title
属性来描述模式以帮助用户。此属性仅适用于type
属性的值为text
、search
、tel
、url
或email
的情况。 placeholder
-
一个表示元素的
placeholder
属性的字符串,包含一个提示,告诉用户可以在控件中输入什么。占位符文本不能包含回车或换行符。此属性仅适用于type
属性的值为text
、search
、tel
、url
或email
的情况。 readOnly
-
一个表示元素的
readonly
属性的布尔值,指示用户无法修改控件的值。如果type
为hidden
、range
、color
、checkbox
、radio
、file
或按钮类型,则忽略此属性。 selectionDirection
-
一个表示选择发生的方向的字符串。可能的值为:
forward
(选择是从当前区域设置的起始到结束方向上执行的)、backward
(相反的方向)或none
(方向未知)。 selectionEnd
-
一个表示选择文本的结束索引的数字。当没有选择时,它返回当前文本输入光标位置后面的字符的偏移量。
selectionStart
-
一个表示选择文本的开始索引的数字。当没有选择时,它返回当前文本输入光标位置的偏移量。
size
-
一个表示元素的
size
属性的数字,包含控件的可视大小。此值以像素为单位,除非type
的值为text
或password
,在这种情况下,它是一个整数字符数。仅当type
设置为text
、search
、tel
、url
、email
或password
时才适用。
实例方法
也从其父接口 HTMLElement
继承方法。
checkValidity()
-
返回一个布尔值,如果元素是约束验证的候选项,并且它不满足其约束,则为
false
。在这种情况下,它还会在元素上触发invalid
事件。如果元素不是约束验证的候选项,或者它满足其约束,则返回true
。 reportValidity()
-
运行
checkValidity()
方法,如果它返回 false(对于无效输入或未提供模式属性),则以与提交表单相同的方式向用户报告输入无效。 select()
-
选择输入元素中的所有文本,并将其聚焦,以便用户随后可以替换其所有内容。
setCustomValidity()
-
设置元素的自定义有效性消息。如果此消息不是空字符串,则元素存在自定义有效性错误,且其值无效。
setRangeText()
-
替换输入元素中的一段文本为新文本。
setSelectionRange()
-
选择输入元素中的一段文本(但不聚焦)。
showPicker()
-
显示浏览器的日期、时间、颜色和文件选择器。
stepDown()
stepUp()
事件
也从其父接口 HTMLElement
继承事件。
使用 addEventListener()
或通过将事件监听器赋值给此接口的 oneventname
属性来监听这些事件:
规范
Specification |
---|
HTML Standard # htmlinputelement |
浏览器兼容性
BCD tables only load in the browser
参见
- 实现了该接口的 HTML 元素:
<input>