HTML5剖析.ppt

2 表单元素的属性 2.1 记住表单中的数据 在HTML 5的input元素中，属性autofocus是一个布尔值，用于设置页面加载完成后光标是否自动锁定input元素，即是否使元素自动获取焦点。 在input元素中，如果将该属性的值设置为true或直接输入autofocus属性名称，则对应的元素将自动获取焦点。 （1）新的form属性；（2）新的input属性。 2.2 验证表单中输入的数据是否合法 通过pattern属性可以验证表单中输入的数据是否合法。pattern 属性用于验证input 域的模式，这里的模式是正则表达式。 pattern属性适用于以下类型的input标签： text search url telephone email password 2.3 在文本框中显示提示信息 HTML 5中，属性placeholder能够提供一种描述输入域期待值的提示，适用于input标签的text、search、url、telephone、email以及password类型。 input元素中的placeholder属性是一种“占位”属性，其属性值是一种“占位文本”。占位文本就是显示在输入框中的提示信息，当输入框获取焦点时，该提示信息自动消失；当输入框丢失焦点时，提示信息又将重新显示。 2.4 验证文本框中的内容是否为空 HTML 5中，使用属性required可以验证文本框中的内容是否为空。 2.5 开启表单的自动完成功能 HTML 5中，使用属性autocomplete可以设置form或input域的自动完成功能。属性autocomplete适用于form标签以及input 标签中的text、search、url、telephone、email、password、datepickers、range和color类型。 当用户在自动完成域中开始输入时，浏览器应该在该域中显示填写的选项。在某些浏览器中可能还需要启用自动完成功能，才能使该属性生效。 2.6 重写表单中的某些属性 HTML 5中，通过表单重写属性（form override attributes）可以重写 form 元素的某些属性设定。 HTML 5中的表单重写属性有： formaction：重写表单的action属性。 formenctype：重写表单的enctype属性。 formmethod：重写表单的method属性。 formnovalidate：重写表单的novalidate属性。 formtarget：重写表单的target属性。 表单重写属性适用于以下类型的input标签： submit image 2.7 自动设置表单中传递数字 HTML 5网页中，使用属性min、max和step可以为包含数字或日期的input类型规定限定（约束）。 max属性：规定输入域所允许的最大值。 min属性：规定输入域所允许的最小值。 step属性：为输入域规定合法的数字间隔。如果step=3，则合法的数是-3，0，3，6等。 属性min、max和step适用于以下类型的 input 标签： date pickers number Range 2.8 在表单中选择多个上传文件 HTML 5中，使用属性multiple可以设置在输入域中选择多个值。 属性multiple适用于如下两种类型的input标签。 Email file 3 新的表单元素 3.1 在表单中自动提示输入文本 在全新的HTML 5中，使用datalist元素可以设置输入域的选项列表。列表是通过datalist内的option元素创建的，如需把datalist绑定到输入域，可使用输入域的list属性引用datalist的id。 datalist是HTML 5中新增的元素，用于辅助表单中文本框的数据输入。 3.2 一个简单的乘法计算器 全新的HTML 5中，使用output元素可以实现不同类型信息的输出，如计算或脚本输出。该元素必须从属于某个表单，或通过属性指定某个表单。 output元素的功能是在页面中显示各种不同类型表单元素的内容，如输入框的值、JavaScript代码执行后的结果值等。为了获取这些值，需要设置output元素的onFormlnput事件。在表单输入框中录入内容时触发该事件，从而十分方便地实时侦察表单中各元素的输入内容。 3.3 在网页中生成一个密钥 在全新的HTML 5中，keygen元素是一项密钥对生成器（key-pair generator）技术。 用户提交表单时会生成两个键，一个是私钥，一个公钥。其中，私钥（Private Key）存储于客户端，公钥（Public Key）则被发送到服务器。公钥可用于之后验证用户的客户端证书（Client Ce