整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

HTML5之新增表单属性和属性值

、新增input type属性值

  • 说明

新增input type 属性值

类型 使用示例 描述

email <input type="email"> 必须输入邮箱格式

tel <input type="tel"> 必须输入手机号码格式

url <input type="url"> 必须输入url格式

number <input type="number"> 必须输入数字格式

search <input type="search"> 必须搜索框(体现语义化)

range <input type="range"> 自由拖动滑块

time <input type="time"> 小时分钟

date <input type="date"> 年月日

datetime <input type="datetime"> 时间

month <input type="month"> 月年

week <input type="week"> 星期 年

color <input type='color'> 颜色

二、新增常用表单属性

  • 说明

新增的input标签属性

属性 用法 含义

placeholder <input type="text" placeholder="请输入..."> 占位符 当用户输入的时候 里面的文字消失 删除所有文字,自动恢复

autofocus <input type="text" autofocus> 规定当页面加载时 input 元素应该自动获得焦点

multiple <input type="file" multiple> 多文件上传

autocomplete <input type="text" autocomplete="off"> 规定表单是否应该启用自动完成功能 有2个值,一个是on 一个是off on 代表记录已经输入的值 1.autocomplete 首先需要提交按钮2.这个表单您必须给他名字

required <input type="text" required> 必填项 内容不能为空

这里我们创建一个填写个人基本信息的表单,使用了表单元素有<input>输入框、<datalist>选项列表、<textarea>文本框,通用的表单输入类型有text、password、file、radio、checkbox、email、url、number、Date pickers。并为表单及表单元素设定了相应的属性。代码如下:

9 novalidate

novalidate是属性规定在提交表单时不应该验证form和input域。novalidate属性适用于的<input>类型有:text、search、url、telephone、email、password、date pickers、range及color。用法如下:

这段代码中,我们为表单设置novalidate属性,使表单不验证提交,表单中的email和url文本域不必通过验证。