《HYLI5教程课件》_《HYLI5教程课件》_第八章 网页表单应用.pptxVIP

;;;8.1.1表单属性;3、name属性

name属性指定了表单的名称,以便区分同一个页面中的多个表单。

4、autocomplete属性

autocomplete属性用于指定表单提供自动完成功能。所谓“自动完成”是指将表单控件之前输入的内容记录下来,当再次输入时,会将输入的历史记录显示在一个下拉列表里,以便通过选择达到快速完成输入的目的。

autocomplete有两个属性值,其功能如下。

●on:表单有自动完成功能。

●off:表单无自动完成功能。

我们通过实例来演示一下autocomplete属性的使用，如例所示。;5、novalidate属性

novalidate属性用于指定在提交表单时取消对表单进行有效检查。当表单设置该属性时,可以关闭整个表单的验证,这样可以使form内的所有表单控件不被验证。

下面我们通过实例来演示一下novalidate属性的使用,如例所示;8.1.2input标记;name;1、input元素的type属性

在HTML5中,input元素的type属性有多个属性值,用于定义不同的控件类型。下面我们对input的各个控件进行说明。

(1)单行文本输入框inputtype=text/

单行文本输入框常用来输入简短的信息,如用户名、账号、证件号码等,常用的属性有name、value、maxlength等。

(2)密码输入框inputtype=password/

密码输入框用来输入密码,默认内容将以圆点的形式显示。

(3)单选按钮inputtype=radio/

单选按钮用于单项选择,如选择性别、是否操作等。需要注意的是,在定义单选按钮时，必须为同一组中的其它选项指定相同的name值,这样“单选”才会生效。此外可以对单选按钮应用checked属性,指定默认选中项。

(4)复选框inputtype=checkbox/

复选框常用于多项选择,如选择兴趣、爱好等,也可对其应用checked属性,指定默认选中项。

(5)普通按钮inputtype=button/

普通按钮常常配合JavaScript脚本语言使用,使得页面具有更好的交互性。

(6)提交按钮inputtype=submit/

提交按钮是表单中的核心控件,用户完成信息的输入后,一般都需要单击提;交按钮才能完成表单数据的提交。可以通过修改value属性的属性值来改变提交按钮上的默认文本。

(7)重置按钮inputtype=reset/

当用户输入的信息有误时,可单击重置按钮取???已输入的所有表单信息。可以通过修改value属性的属性值来改变重置按钮上的默认文本。

(8)图像形式的提交按钮inputtype=image/

图像形式的提交按钮与普通的提交按钮在功能上基本相同,只是它用图像替代了默认的按钮,外观上更加美观。但是必须要设定src属性指定图像的URL地址。

(9)隐藏域inputtype=hidden/

隐藏域对于用户是不可见的,通常用于后台的程序。

(10)文件域inputtype=file/

当定义文件域时,页面中将出现一个文本框和一个“浏览…”按钮,用户可以通过填写文件路径或直接选择文件的方式,将文件提交给后台服务器。

下面我们通过实例来演示一下这些控件和属性的使用,如例所示。;(11)email类型inputtype=email/

email类型的input元素是一种专门用于输入E-mail地址的文本输入框,用来验证email输入框的内容是否符合E-mail邮件地址格式,如果不符合将提示相应的提示信息。

(12)url类型inputtype=url/

url类型的input元素是一种用于输入URL地址的文本框。如果所输入的内容是URL地址格式的文本,则会提交数据到服务器,如果输入的值不符合URL地址格式则不允许提交，并且会有提示信息。

(13)tel类型inputtype=tel/

tel类型用于提供输入电话号码的文本框,由于电话号码的格式千差万别,很难实现一个通用的格式。因此tel类型通常会和pattern属性配合使用,pattern属性是HTML5中的新属性，用来设定输入数据的格式。;(14)search类型inputtype=search/

search类型是一种专门用于输入搜索关键词的文本框,它能自动记录一些字符,如站点搜索或者Google搜索。在用户输入内容后,右侧会附带一个删除图标,单击这个图标按钮可以快速清除内容。

(15)color类型inputtype=color/

color类型用于提供设置颜色的文本框,用于实现一个RGB颜色输入。其基本形式是#RRGGBB,(颜色由红(R)、绿(G)、蓝(B)组成。每个颜色的最低值为0(十六进制为00)，最高值为255(十六进制为