HTML5系列:HTML5表单

1. input元素新增类型

  url类型

  url类型的input元素是一种用来输入url的文本框,提交时如果该文本框中内容不是url格式,则不允许提交。

<input type="url" />

  email类型

  email类型的input元素是用来输入email的文本框,具有一个multiple属性允许在文本框中输入一串以逗号分隔的email地址。

<input type="email" multiple />

  date类型

  date类型的input元素用来输入日期的文本框。

<input type="date" value="2015-04-19" />

  time类型

  time类型的input元素是用来输入时间的文本框。

<input type="time" value="00:19" />

  month类型

  month类型的input元素用来输入月份的文本框。

<input type="month" value="2015-04" />

  week类型

  week类型的input元素用来输入周号的文本框。

<input type="week" value="2015-W20" />
时间: 2024-10-06 00:39:20

HTML5系列:HTML5表单的相关文章

HTML5的form表单属性

form:HTML4中,表单内的从属元素必须书写在<form></form>之内,但是在HTML5中,表单的从属元素可以处于页面的任何位置,然后为其添加form属性,属性值为form表单的id属性值即可,表单form与从属元素的从属关系依然有效, like this: <form id="log"> <input type="submit"> </form> <input type="sub

html5中form表单新增属性以及改良的input标签元素的种类

在HTML5中,表单新增了一些属性,input标签也有了更多的type类型,有些实现了js才能实现的特效,但目前有些浏览器不能全部支持.下面是一些h5在表单和input标签上的一些改动. <!DOCTYPE html><html> <head> <title>表单测试</title> <meta charset="utf-8" /> <!-- 在不支持h5的浏览器中,可以用CSS样式进行改写 --> &

HTML5 学习笔记 表单属性

HTML5新的表单属性 HTML5 的form和input 标签添加了几个新的属性 <form>新属性 autocomplete novalidate input 新属性 autocomplete autofocus form formaction formenctype formmethod formnovalidate formtarget height and width list min and max multiple pattern (regexp) placeholder req

html5 自带表单验证怎么禁用

HTML5加强了表单验证功能,可验证是否可空及输入内容的类型及格式,并可通过为表单或控件设置 novalidate 属性指定在提交表单时不验证整个 form 或指定的input. 例: ENDINPUT验证INPUT 标签中通过 type属性指定输入内容类型:email,指定输入内容为电子邮件地址.url,指定输入内容为URL.number,指定输入内容为数字,并可通过 min.max.step 属性指定最大最小及间隔.date.month.week.time.datetime.datetime

HTML5实战 文摘 第二章 HTML5用于创建表单的输入小部件 数据绑定以及数据验证

HTML5表单在原有表单特性的基础上增加了一些比较便捷的特性,使得我们实现一些常用的表单的小部件.输入类型.输入验证不再那么大费周章.上一篇文章提到了HTML5实现的几种新的输入类型,现在我们更加详尽的了解HTML5的表单产生的新特性和功能. 1. 输入类型和输入属性 菜鸟教程上给出了HTML5新增加的input输入类型,可以在上面尝试一下不同类型的样子,基本可以满足日常开发需求了.类型不同会照成什么内在差异呢?主要有三点,首先,浏览器会根据输入类型进行基本的数据校验,例如type="email

[html5] 学习笔记-表单新增元素与属性

本节讲的是表单元素的form,formaction属性,frommethod,formenctype属性,formtarget,autofocus属性,required,labels属性. 1.form属性 在html4中,表单内的从属元素必须书写在表单内部,而在html5中,可以把他们书写在页面上任何地方,然后为该元素指定一个form属性,属性值为该表单的id,这样就可以指定该元素从属于指定表单了. 以往的写法: 1 <body> 2 <form id="testform&q

[html5] 学习笔记-表单新增的元素与属性(续)

本节主要讲解表单新增元素的controls属性.placeholder属性.List属性.Autocomplete属性.Pattern属性.SelectionDirection属性.Indeterminate属性.Image提交按钮的宽高属性. 1.controls属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的controls属性来访问该表单元素. 1 <body> 2 <script> 3 function setValue(){ 4 var label

HTML5学习之二:HTML5中的表单2

(本内容部分节选自<HTML 5从入门到精通> 对表单的验证 -------------------------------------------------------- ?1.required属性 required属性主要目的是确保表单控件中的值已填写.在提交时,如果元素中内容为空白,则不允许提交,同时在浏览器中显示信息提示文字,提示用户这个元素中必须输入内容. ?2.pattern属性 pattern属性主要目的是根据表单控件上设置的格式规则验证输入是否为有效格式.对input元素使用

HTML5学习之二:HTML5中的表单1

(本内容部分节选自<HTML 5从入门到精通>) 1.新增表单元素与属性 ———————————————————————————————————————————————————————— placeholder——是指当文本框(<input type=“text”>或<textarea>)处于未输入状态时文本框中显示的输入提示.当文本框处于未输入状态并且未获取光标焦点时,模糊显示输入提示文字. <label>搜索:<input type="t

玩转html5(三)---智能表单(form),使排版更加方便

<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>form表单学习笔记</title> </head> <body> <!-- 在旧版的html中,form表单与input等元素必须嵌套使用,为了排版方便,在html中提出了新方法