第四章表单与文件-笔记-新增属性

新增属性 以及其支持性

form属性：

在html4中，表单内从属元素必须书写在表单内部，在html5中可以把他们书写在页面的任何地方，然后给该元素指定一个form属性，属性值为该表单的id。这样就可以声明该元素从属与指定表单了。    　　这样做的好处是当需要给页面中的元素添加样式时可以更方便地添加，因为他们不是呗散在各个表单之内的 

*************************************只有opera10支持

formaction属性

在html4中，一个表单内的所有元素都只能通过表单的action属性统一提交到另一个页面，而在html5中可以给所有的提交按钮都增加不同的formaction属性，点击不同的按钮，可以将表单提交到不同的页面。

*************************************目前暂时没有浏览器支持

formmethod属性

在html4中。一个表单内只有一个action属性来对表单内所有元素统一制定提交页面，所以每个表单内只有一个method属性统一制定提交方法。在html5formmethod属性因此也能指定多个。

*************************************目前暂时没有浏览器支持

placeholder属性

指当文本框处于未输入状态时文本框中显示的输入提示。 实现方法：只要加上placeholder属性，然后制定提示文字就可以了如<input type="text" placeholder="请输入" />

*************************************支持的有：safari4 chrome3 firefox4

 autofocus属性

当页面打开时，该控件自动获得光标焦点，目前为止要做到这一点需要使用javascript。

从实用的角度来说，请不要随便滥用该属性，建议只有当一个页面时以使用某个控件为主要目标时，采用，如搜索页面中的搜索文本框。

*************************************支持的有：safari4 chrome3 firefox4

list属性

在html5中，为单行文本框增加了一个list属性，改属性的值为某个datalist元素的id，datalist是html5中新增元素，该元素类似于选择器select，但是当用户想要设定的指1不在选择列表之内时，允许其自行输入。该元素并不显示，而是当文本框获得焦点时以提示输入的方式显示。

为了避免在没有支持该元素的浏览器上出现显示错误，可以用css等将它设定为不显示

为什么没有把input元素与datalist元素结合成一个元素，主要是基于兼容性的考虑，如果浏览器不支持html5的这个属性就会忽略掉。

************************************* chrome3 firefox4 与oprea支持的有些不同。。前两者需要点击一下才可以

autocomplete属性

辅助输入所用的自动完成功能，是一个节省输入时间。在html5之前，因为谁都可以看见输入的值，所以存在安全隐患，但只要使用这个属性，安全性就能很好的控制。

他有三个值 "on" "off" "",不指定时，使用浏览器默认的值,值为on时，可以显示指定候补输入的数据列表，使用datalist元素和list属性提供候补输入的数据列表，自动完成时，可以将datalist元素中的数据作为候补输入的数据在文本框中自动显示

*************************************目前只有oprea10支持

 

 

增加和改良了input元素的种类

对于这些新增的input种类来说，对于不支持他们的浏览器来说，统一将这些input元素视为text类型。

html5中没有规定这些元素在各个浏览器中的外观样式，所以同样的input元素在不同的浏览器显示的效果会有所不同

url类型

提交时如果该文本框中的内容不是url地址格式的文字，则不允许提交

email类型

提交时如果该文本内容不是email地址格式则不允许提交，但是它并不检查该email地址是否存在，提交时该文本框可以为空除非加上required属性

date类型

以日历的形式方便输入

time类型

他的外观取决于浏览器  *************************************chrome oprea支持

datetime类型

是一种专门用来输入UTC日期和时间的文本框，并且在提交时会对输入的日期和时间进行有效性检查

*************************************oprea支持

datetime-local类型

是一种专门用来输入本地日期和时间的文本框，并且在提交时会对输入的日期和时间进行有效性检查

*************************************chrome oprea支持 效果跟datetime有点像

month类型

是一种专门用来输入月份的文本框，并且在提交时会对输入的月份进行有效性的检查。

*************************************chrome oprea支持

week类型

是一种专门用来输入周号的文本框，并且在提交时会对周号的有效性进行检查

*************************************chrome oprea支持

number类型

是一种专门用来输入数字的文本框，并且在提交时会检查其中的内容是否为数字，他具有min,max,与step属性

*************************************chrome oprea支持

range类型

是一种只允许输入一段范围内数值的文本框，他具有min属性与max属性,可以设定最大值和最小值（默认是0到100），也具有step属性，他可以指定每次拖动的步幅在oprea中是以滚动条的方式进行值的指定。

*************************************chrome opera支持

search类型

是一种专门用来专门搜索关键的文本框，他与text类型仅仅在外观上有区别。

*************************************chrome opera firefox都不支持

tel类型

用来输入电话号码的专用文本框，没有特殊的校验，可以通过pattern属性来指定对于输入的电话号码的格式的验证

color类型

是一个颜色的选取器

*************************************chrome oprea支持。

 

output元素的追加

这个元素必须从属于某个表单，他必须书写在表单内部，或者给他家form属性