HTML5 的新的表单属性

yesbuy00 2017-02-08

1新的form属性:

autocomplete

autocomplete属性

autocomplete属性规定form或input域应该拥有自动完成功能。

注释:autocomplete适用于<form>标签,以及以下类型的<input>标签:text,search,url,telephone,email,password,datepickers,range以及color。

当用户在自动完成域中开始输入时,浏览器应该在该域中显示填写的选项

PS:白话文:该属性也就是可以点出上次输入的text文本框的值

<form action="demo_form.asp" method="get" autocomplete="on">
First name: <input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
E-mail: <input type="email" name="email" autocomplete="off" /><br />
<input type="submit" />
</form>

2新的input属性:

2.1autofocus:属性规定在页面加载时,域自动地获得焦点,适用于所有<input>标签的类型

Username:<inputtype="text"name="user_name"autofocus="autofocus"/>

2.2

注释:form属性适用于所有<input>标签的类型。form属性必须引用所属表单的id:

  
<form action="demo_form.asp" method="get" id="user_form">
First name:<input type="text" name="fname" />
<input type="submit" />
</form>
Last name: <input type="text" name="lname" form="user_form" />

2.3

list属性

list属性规定输入域的datalist。datalist是输入域的选项列表。

注释:list属性适用于以下类型的<input>标签:text,search,url,telephone,email,datepickers,number,range以及color。

Webpage: <input type="url" list="url_list" name="link" />
<datalist id="url_list">
<option label="W3Schools" value="http://www.w3school.com.cn" />
<option label="Google" value="http://www.google.com" />
<option label="Microsoft" value="http://www.microsoft.com" />
</datalist>

2.4

pattern属性

pattern属性规定用于验证input域的模式(pattern)。模式(pattern)是正则表达式。

注释:pattern属性适用于以下类型的<input>标签:text,search,url,telephone,email以及password。

 
Country code: <input type="text" name="country_code" pattern="[A-z]{3}"     title="Three letter country code" />

2.5

placeholder属性:默认值

placeholder属性提供一种提示(hint),描述输入域所期待的值。

注释:placeholder属性适用于以下类型的<input>标签:text,search,url,telephone,email以及password。

<input type="search" name="user_search"  placeholder=请输入值" />

2.6

required属性

required属性规定必须在提交之前填写输入域(不能为空)。

注释:required属性适用于以下类型的<input>标签:text,search,url,telephone,email,password,datepickers,number,checkbox,radio以及file。

Name: <input type="text" name="usr_name" required="required" />

3HTML5中的新标签。

3.1<abbr>定义缩写。鼠标移到PRC就会有abbr的提示

The <abbr title="People's Republic of China">PRC</abbr> was founded in 1949.

3.2bdo元素可覆盖默认的文本方向。rtl左到右,rtl右到左

<bdodir="rtl">Hereissometext</bdo>:显示HereissomeHebrewtext

<bdodir="rtl">Hereissometext</bdo>:显示HereissomeHebrewtext

相关推荐