【笔记】input的属性、事件及其应用
Mar 2, 2019笔记html5webApiinput的属性、事件及其应用(持续)
众所周知,html中的<input/>
标签可以说是h5中属性及事件最复杂也最多的标签,本文旨在记录工作中遇到的,不常用的input相关属性及事件。
1.属性
1.1 capture属性
*源于某需求要求只调摄像头拍照而不能调相册,且默认调起前置摄像头。
1 | <input type="file" accept="image/*" name="image" capture="user"> |
当一个input元素的type属性是文件上传的状态时,并且它的accept属性是特定的,capture的属性规则将适用。
capture属性的关键词是”user”和”environment”,它们映射到各自的状态用户和环境。状态用户和环境的语义反映了在videoFacingModeEnum中定义的同名枚举值。此外,还有第三种状态,即特定于实现的状态。缺少的默认值是特定于实现的状态。无效值默认值也是特定于实现的状态。
注意,如果user agent无法支持首选朝向模式,它可以返回到特定于实现的默认面向模式,该模式映射到特定于实现的状态,该状态指示实现将根据其默认行为进行操作。
capture IDL属性必须反映相同名称的相应内容属性。当指定了捕获属性时,用户代理应该调用特定捕获控件类型的文件选择器。
当指定了捕获属性时,用户代理不能将捕获的媒体保存到任何本地或远程数据存储中。
注意:当脚本获得从文件选取器(由文件列表对象表示)中选择的文件的访问权限时,它们可以使用各种机制来存储捕获的媒体。这些机制超出了本规范的范围。
如果接受属性的值设置为没有关联捕获控制类型的mime类型,则用户代理必须充当没有捕获属性的角色。
注意:如果input标签含multiple属性,capture就失效了。
1.1.1 举例
调起前置摄像头拍照或录像
1 | <!-- 拍照 --> |
调起后置摄像头拍照或录像
1 | <!-- 拍照 --> |
1.2 autocapitalize属性 autocapitalize是一个枚举属性,它控制用户输入/编辑文本输入时文本输入是否自动大写,以及如何自动大写。属性必须取下列值之一:
off
ornone
: 没有应用自动大写(所有字母都默认为小写字母)。on
orsentences
: 每个句子的第一个字母默认为大写字母;所有其他字母都默认为小写字母。words
: 每个单词的第一个字母默认为大写字母;所有其他字母都默认为小写字母。characters
: 所有的字母都默认为大写。
在物理键盘上输入时,autocapitalize 属性不会影响行为。相反,它会影响其他输入机制的行为,比如移动设备的虚拟键盘和语音输入。这种机制的行为是,它们经常通过自动地将第一个句子的字母大写来帮助用户。autocapitalize 属性使作者能够覆盖每个元素的行为。
autocapitalize 属性永远不会为带有 type 属性,其值为 url, email 或 password的 元素启用自动大写。
1.3 autocorrect属性(非标准)
在ios中,autocorrect属性用来控制用户输入/编辑文本输入时文本输入是否开启自动纠正。属性必须取下列值之一:
on
:开启;off
:关闭
Author
My name is Micheal Wayne and this is my blog.
I am a front-end software engineer.
Contact: michealwayne@163.com