(表单制作.docxVIP

表单家族绝对是HTML标签中的最重要组成部分之一。在互联网诞生的初期，几乎所有的页面都只是为了共享信息而建立的：人们把内容以网页的形式存放在服务器中，浏览者到服务器的地址去获取该信息，类似报纸和电视的形式，浏览者只是被动地阅读，和网站本身的交互很少。后来，互联网进一步发展，网民可以把自己的意见、自己的选择反馈回服务器，构成了一种双向的交流。在这个从客户端（也就是网民所在的位置）发送信息到服务器端（也就是网站所在的位置）的过程中，就需要表单标签。表单存在于哪些网页呢？从我们日常上网的行为来看，大多数人至少参与过如下几种活动：查收电子邮件。进行网上购物。对网站新闻进行评论。1、表单家族介绍表单标签的写法是form…/form，该名称从Form翻译而成。和表格不同的是，table标签需要tr和td标签的配合才能形成一张表格，而表单则是独立的，不需要额外标签的帮助就可以形成。当然，为了完成一定的功能，表单需要获取用户输入的信息，即input标签的帮助。它们之间并没有依附关系，但由于目的类似，习惯上将这些input标签归于表单家族之中。表单家族共有如下一些成员：form标签：通知浏览器下面将出现一个表单，同时可以设置标单的一些属性。input标签：提供各种形式的用户输入框或者选择框，获取信息。这个标签根据类型的不同，又可以分为文本框、按钮、列表框、单选按钮和多选框等等。我们将在后面的几节中具体讲述。2、Form标签表单标签的语法如下：form action=URL…/form在上面的代码中，action是表单标签的必选属性，因为表单既然是发送客户端信息的，当然要有一个发送目标，也就是服务器端接收这些信息的网页地址。如果为空，则表示当前网页就是接收地址，也就是说，一个网页既可以作为发送端，也可以作为接收端，当然，这肯定不是一般的HTML了，也不在本书讨论的范围。我们只需要知道action后面要写清楚的是一个合法存在的网页即可，至于该网页内部发生了什么，如何接收，那是程序员的事情。3、表单如何提交? ? ? 表单要提交后才能把内容发送到服务器端，要实现提交的功能，表单中必须有一个类型为Submit（中文意思就是提交）的按钮（是Input标签的一种，下文将讲到）。当浏览者单击此按钮，表单的内容才有可能发送到服务器。4、Form标签在浏览器中的外观? ? ? ?单独的一个form/form标签在浏览器显示页面中是看不到的。代码包含了一个表单，并未添加其他用户输入的界面（也就是诸多input标签），在浏览器中的显示如图所示，页面一片空白。? ??5、形形色色的输入标签? ? ? ? 所谓输入标签，是根据input这个英文单词翻译而来，因为表单中大部分的用户输入都要input标签来获取。输入标签不限于输入文字，而是表达了用户的参与，所以对于选择，按钮这些需要用户根据自己意愿进行干预的选择框、按钮等也统称输入框。input标签的基本书写语法如下：input type=”输入框类型”…/input同时，input标签也具有HTML的公共属性，比如Id属性，可以用于设置Id信息；class和style属性，用于设置输入标签的行内样式表和应用内/外部样式表。6、表单家族各成员标签的特点除了表单家族各成员的共同特点（type属性、Name属性、id属性等）之外，它们各自还有一些特别的属性，见表所示。7、表单家族各成员标签的事件在前文，我们比较详细的介绍了事件，其实很多HTML标签都有事件，表单也是如此。【Form标签的事件】对于Form标签来说，提交表单可以是最重要的一个事件了，也就是OnSubmit事件。我们可以在页面中添加一个事件处理程序，当表单提交的时候，进行各输入框的检查：比如在注册页面中，检查电子邮件是否符合规范；邮政编码是否合乎规范等等。这个功能经常在网络上见到。另外一个不那么重要的Form标签事件是OnReset事件，当表单被重置时发生。表单标签同样具有很多HTML标签都共有的onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup这些事件。8、表单与样式表? ? ? ?上文我们已经见到了表单以及其成员标签的默认外观，外围有一个比较粗的边框，颜色和系统的对话框也很相像，显得比较普通，在本节中将通过CSS技术，改变它们的外观。9、清除Form标签前后的空格? ? ? ?代码7-3是一个网站的用户登录页面，网页中从上到下共有三个表格，其中第二个表格坐落在一个form标签之中，包含需要用户输入的个人信息等，用户单击登录按钮，即可提交表单进入网站。? ? ?10、设置丰富背景色的选择框