暂时没有公告

首页:软件测试网 >> 软件测试技术 >> 软件测试开发语言 >> 自动测试脚本语言 >> 查看资讯

字号: 小中大 | 推荐给好友上一篇 | 下一篇

本章将扩充你的初级HTML标识符的知识，向你讲述怎样使用窗体、列表及表格

发布: 2007-6-30 18:56 | 作者: admin | 来源: | 查看: 93次 | 进入软件测试论坛讨论

本章将扩充你的初级HTML标识符的知识，向你讲述怎样使用窗体、列表及表格。通过使用窗体，你可以与参观你网页的用户进行交互，本章也向你介绍怎样使用HTML标识符了创建信息列表，读完本章后，你还可在你的网页上使用HTML表格来设计更好的界面。

使用HTML窗体

要建立一个交互式的网点，你需要使用HTML窗体，它可以让你收集参观你网点的用户提供的信息，并对此作出反应。使用窗体，你可以建立类似复选框、单选按钮及文本框的控件。

掌握窗体的使用对高效的Active Server Pages编程是必需的。ASP脚本的一个主要功能是对HTML窗体中输入的信息进行处理，因此，你应当将窗体看作是ASP应用程序中主要的用户接口。

要建立HTML窗体，可以使用<FORM>标识符，它是一个容器标识符，包含其它窗体元素并在它的属性中指明对于此窗体中收集的信息应怎样处理。下面是个非常简单的窗体例子：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

<FORM>

<INPUT>

</FORM>

</BODY>

</HTML>

当这个HTML文件在网络浏览器上显示时，一个三维外观的框会显示在屏幕上（如图6.1），你可以在框中输入任何你需要的文字。然而它是死的，你输入文字后什么也不会发生。这个窗体实在是太简单了，没有什么实际用途。

这个例子的一个问题是窗体不知道何时你已经输入信息完毕了。要解决这个问题，你需要加入另一个窗体元素：submit按钮。下面的例子是同一个窗体，只是加了一个submit按钮：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

<FORM>

<INPUT>

</FORM>

</BODY>

</HTML>

当你显示这个修改后的HTML文件时，出现了一个具有Submit Me!文字的按钮，用鼠标点击这个Submit Me!按钮，你就表明你已经在这个文本框中输入完信息了。这就通知浏览器它应该对输入的信息进行处理。

图6.1 一个简单的HTML窗体

然而，现在窗体还不知道怎样处理它收集到的信息，你必须通过<FORM>的ACTION属性来通知窗体怎样处理这些信息。ACTION属性决定了窗体对输入的信息将会采取何种方式处理。下面的例子显示了怎样使用这个属性：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

<INPUT>

</FORM>

</BODY>

</HTML>

当你在窗体中输入完信息并提交后，ACTION属性就会告诉窗体信息应当立即被送往Microsoft的Bill Gates。你可以使用下面的语句来将窗体信息发往任何一个Internet 地址：

然而，你很少要将窗体信息发往一个E_Mail地址，在大部分情况下，你需要把窗体信息发给本地网点进行处理。第15章“使用多个Active Server Pages”介绍了怎样建立Active Server Pages脚本来处理窗体信息。要将窗体信息发往一个Active Server Page，你可以使用下面的HTML语句：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

<INPUT>

</FORM>

</BODY>

</HTML>

在此例中，ACTION和METHOD属性指明了窗体信息应当被发送给名为mypage.asp的Active Server Pages去处理。ACTION属性给出了Active Server Pages的路径，METHOD属性指明窗体信息通过什么方式送出。在此粒中，在文本框中输入的窗体信息通过post方式送给Active Server Pages。

几乎在所有的情况下，<FORM>标识符都和本例中的用法一样，你可以通过ACTION属性来指定处理窗体的Active Server Page，并且通过METHOD属性指定窗体信息用post方式发送。

在这个例子中，还要加入一条语句才能使之实用化。当你包含例如文本框之类的窗体元素时，你应当为每个窗体元素起一个名字。你可以通过<INPUT>的NAME属性来实现这一点。下面的例子有两个不同的文本框，分别叫作text1和text2：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

</FORM>

</BODY>

</HTML>

在此例中，在名为text1的文本框中输入的信息当被传送给网站处理时，将会与名字text1相关联，这样在第一个文本框中输入的信息就与在其它窗体元素中输入的信息区别开来。

窗体信息将会送到在ACTION属性中指定的目的地去，这个信息包括用&符号分隔的名字和值。例如，如果你在第一个文本框中输入your first name，在第二个文本框中输入your last name，则送去处理的信息将会是：

text1=yourfirstname&text2=yourlastname

事实上，在发送之前，窗体信息要先编码。当文本编码后，文本被一些特定的字符替换了。例如，空格符被加号（+）代替。因此如果你在第一个文本框中输入This is textbox1，而在第二个文本框中输入This is textbox2，则下列的文本将会被送去处理：

text1=This+is+textbox1&text2=This+is+textbox2

当你从第15章中学会怎样开发ASP脚本后，你将会学习怎样处理编码后的窗体信息。

在窗体中使用其它HTML标识符

正如你在文件主体中使用HTML标识符一样，你也可以在<FORM>标识符中使用几乎所有的HTML标识符。这个特性对于为你的窗体元素建立标签是很有用的。例如，如果你有一些文本框，你可能要为它们建立一些标签，如下所示：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

<BR><B>First Name：</B> <INPUT NAME=“firstname”>

</FORM>

</BODY>

</HTML>

在此例中，名为firstname的文本框的左边有标签文字（黑体）：First Name，而名为lastname的文本框也是这样（见图6.2）。如果你需要，你也可以将特性放置于文本框的旁边。通过使用图象，你可以为你的窗体元素加上一些有趣的标签。

然而，用HTML标识符你无法改变显示在窗体元素上的文字。例如，你用HTML无法让Submit按钮上的文字Submit Me!以黑体显示。而且，你无法控制在文本框中输入的文本的外观，这是现在HTML的一个弱点。你的窗体总是显示灰色按钮及黑色文字（除非你使用图象，这将在下一节介绍）。

注意

虽然你不能用标准HTML来控制窗体元素中文字的外观，但你可以在Netscape Navigator 4.0和Internet Explorer 4.0中使用cascading style sheet来做到这一点。可参阅下一章来学习怎样使用cascading style sheet。

图6.2 使用标签的HTML窗体

你可以在HTML文件主体的任何部位放置<FORM>标识符，而且――你会发现这很有用――你可以在同一个HTML文件中包含多个窗体。这对于激活不同的Active Server Page脚本来处理不同的窗体信息是很有用的。要确保你的窗体不互相覆盖，并且不能互相包含。例如，下面的HTML代码是非法的：

<HTML>

<HEAD>

</HEAD>

<BODY >

</FORM>

</BODY>

</HTML>

这个HTML代码不能正常工作，因为一个<FORM>标识符嵌在另一个中。如果你发现一个窗体不如你所期望的那样正常工作，你就得好好检查一下，看是否你偶然地将<FORM>标识符交错了，或是忘记结束你的一个窗体。

文本框

最基本的窗体元素是文本框（见图6.3）。你可以用不带属性的<INPUT>标识符来建立一个空的文本框。然而，要想建立一个有用的文本框，你需要包含NAME属性。下面的例子包含了两个名为text1和text2的文本框：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

</FORM>

</BODY>

</HTML>

图6.3 文本框

注意第一个文本框的TYPE属性设为“text”，你可以根据你的需要在文本框中包含这个属性。但这没有什么特别的效果，因为<INPUT>标识符缺省地将TYPE设为“text”。

你也可以使用<INPUT>的VALUE属性来指定在用户输入前缺省状态下文本框中显示的文字。例如，假设你有一个文本框，让用户在其中输入他的国别，你预计你的大部分用户都是美国人，你可以使用下面的语句将缺省国别设为美国：

<INPUT>的另一个有用的属性是SIZE，使用它你可以控制一个文本框的宽度。你应该根据需要以字符数来指定SIZE属性的值。

注意

由于文本框中显示字体的大小不是固定的，文本框的长度可能不够用来显示一定数量的字符。这是因为不同的字符有不同的宽度，因此你应当将你的文本框的大小设得比你要输入的最大字符数要大些。

文本框的最后一个很有用的属性是MAXLENGTH。通常你可以一直在文本框中输入文字，因为文本框会自动地水平滚动来让你输入更多的东西，但是这有下面的两个弊端：

首先在原理上，某些用户会蓄意在你网点的文本框中输入非常多的文本，让你的网点严重超负荷而无法处理它们。你应当设定用户行为的限度，因此为安全着想，你应当使用MAXLENGTH属性来控制你的用户最多可在文本框中输入多少信息。

有时你蓄意强制用户输入一定长度的信息。例如，你想让用户输入6个数字的邮政编码，而不是其它位数的，这就要靠MAXLENGTH来实现。

窗体按钮

在HTML窗体中典型使用的按钮有三种，我们已经介绍了第一种按钮――Submit按钮。当你点击Submit按钮时，窗体由<FORM>的ACTION属性所指定的程序进行处理，Submit按钮的用法如下所示：

VALUE属性的值决定了在按钮上显示的文字。

图形按钮与Submit按钮的效果几乎是一样的，然而这种类型的按钮显示出来是一幅图象，而不是一个难看的灰色矩形框（见图6.4）。下面的例子说明了怎样使用图形按钮：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

</FORM>

</BODY>

</HTML>

图6.4 图象按钮

和把图象当作超链接时的情况一样，你应当把BORDER属性的值设为零来隐藏在诸如Netscape Navigator这样的浏览器上显示时会出现在图象周围的黑框。在某些情况下，这个附加的图象框会令人分心。你也可以在图象按钮中使用<IMG>标识符的其它属性（见第5章“初级HTML”）。

注意

图象按钮的一个有趣现象是当点击它时，不但提交窗体信息，而且提交图象被点击点的坐标。例如，如果你在一个长宽各为5个象素的图象中央点击它，则在窗体信息之后就会传送点击点的坐标（3，3）。

图象按钮的这个特性对于将窗体功能组合成image map是很有用的（image map将在下一章讨论）。通常的image map不允许你交流窗体的内容。

最后一种按钮类型是reset按钮。当用户点击reset按钮后，所有的窗体内容都恢复到它们初始的值。例如，没有缺省值的文本框将被清空，而用VALUE属性指定了值的将回到初始的特定值。与Submit按钮的情况一样，你通过VALUE属性指定显示在reset按钮上的文字。如下面的例子所示：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

</FORM>

</BODY>

</HTML>

在此例中，窗体用户点击标有Clear Me!的按钮后，所有窗体值都被清除并回到初始状态的值。在一个特定窗体中使用这三种按钮没有什么限制，这将很方便，特别是对于Submit按钮。有时在一个网页中有必要包含好几个Submit按钮，以使用户在决定怎样使用信息时就能发送窗体信息。

例如，假设你的网点有一页用于注册，而且需要让你的用户能够决定他们的注册信息是保持隐秘，还是公开出来。一个方法是，你可以再加入一个附加窗体让用户能选择，而最简单的方法是你建立两个Submit按钮，一个上面写着Register Private，而另一个上面写着Register Public。这后一种方法能让用户简单地通过点击两个按钮中的一个进行选择。

要使用多个按钮，你需要为按钮提供NAME属性，看下面这个简单的例子：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

</FORM>

</BODY>

</HTML>

在这里，点击yes!或是no!按钮都会激发同一个窗体行为，然而当窗体被处理时，用户的选择被获取了（用户的选择怎样被获取可参阅第10章“初级SQL”及第11章“中级SQL”）。

再次重申，本节你学会了HTML窗体中最常使用的三种类型的按钮：

Submit按钮，用于将窗体信息提交给服务器进行处理，或将信息通过E_Mail传送给一个地址。

图象按钮，与Submit按钮的作用相同，但用图象代替了文字。

Reset按钮，将所有窗体的值设置到初始状态的值。
　

密码框

假设你想让用户在参观你的网点之前先进行注册，使用通常的文本框，你可以建立一个HTML窗体来获得用户的名字和密码，但是你不想让用户在输入他们的密码时，有人在他们的背后偷看。要保护用户的密码，你就要使用密码输入框（见图6.5）。密码框的工作原理与文本框类似，只是当信息输入时是隐藏的。下面是个例子：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

Please enter your name and password:

<BR> Password: <INPUT NAME=“password” TYPE=PASSWORD>

</FORM>

</BODY>

</HTML>

图6.5 密码框

注意

值得重视的是在密码框中输入的文本在提交时是不被加密的，因此在理论上这意味着某些人可以在线路上窃取你在密码框中输入的文字。当这些文字通过Internet传送给你的网站时，对大部分应用程序，这不会产生什么问题。你可以对HTML窗体中提交的信息进行加密来防止别人窃取这些信息。见第二章的“使用加密层”一节的“安装和使用Internet信息服务器”。

当上例的HTML文件在网络浏览器上显示时，你可以在密码框中输入文字，就如同在一般的文本框中输入一样。然而，所有输入的文字都被隐藏了（通常是*号）。你可以在密码框中使用SIZE和MAXLENGTH属性来控制密码框的长度及可在框中输入的最大字符数。

复选框

复选框在两种情况下是有用的。在最简单的情况下，你可以用复选框来让用户进行真或假的选择，如下面的例子所示：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

<BR> Do you like this web site?

</FORM>

</BODY>

</HTML>

当这个HTML语句在网络浏览器上显示时，一个空的框出现在问题Do you like this web site?的下面。如果当Submit按钮被按下之前这个框被选择了，则VALUE属性的值也被提交。在这种情况下，NAME和VALUE的值like和yes被提交了。

如果在按下Submit按钮时复选框未被选择，则什么也没有提交，甚至复选框的名字也未提交。你不能将复选框的值指定为“off”。

你也可用一个名字来建立多个复选框来收集信息（见图6.6）。例如，你想知道参观你网点的人是如何发现它的，而且你想提供用户发现你网点的各种可能途径，你可以使用下列的HTML代码：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

<BR> How did you find out about this web site?

<BR> Magazine: <INPUT NAME=“discover” TYPE=CHECKBOX VALUE=“Magazine”>

<BR> Search Engine: <INPUT NAME=“discover” TYPE=CHECKBOX VALUE=“Search”>

<BR> Friend: <INPUT NAME=“discover” TYPE=CHECKBOX VALUE=“Friend”>

</FORM>

</BODY>

</HTML>

图6.6 多个复选框

注意这个例子中的三个复选框有同一个名字。当用户按下了Submit按钮，每个被选择的复选框的值都会被提交。在这种情况下，每个值都与discover的名字相关。

注意

不要将多个复选框与单选按钮（下面将要讨论）混淆。与单选按钮不同，即使复选框有同一个名字，也可同时选择多个复选框。

你可以在一个窗体中根据需要设置多个复选框，如果你需要一组复选框的值与同一个名字相关，那么你就为这一组的每个复选框提供同一个名字。

缺省状态下，复选框初始是未被选择的，你可以通过CHECKED属性来改变这个缺省值。CHECHED属性是那些不带参数的少见的几个属性之一。要建立缺省状态为CHECKED的复选框，可使用下面的标识符：

单选按钮

你可以已经在网页上或是一般的程序上见过单选按钮（见图6.7），使用单选按钮，你可以在多个值之间进行选择，然而与复选框不同，用户一次只能选择一个单选按钮。

例如，假设你需要知道浏览你网页的人的性别，你就可以使用单选按钮来让用户选择他们的性别。下面的例子说明了怎样去做：

<HTML>

<HEAD>

<TITLE> Radio Form </TITLE>

</HEAD>

<BODY >

<BR> Please indicate your sex:

<BR> Female: <INPUT NAME=“sex” TYPE=RADIO VALUE=“female”>

</FORM>

</BODY>

</HTML>

图6.7 单选按钮

注意所有的单选按钮的名字是一样的，当此页的用户点击Submit按钮时，只有一个单选按钮的值会被发送。发送的值是在单选按钮的VALUE属性中指定的值。

与复选框相似，你也可以使用CHECKED属性来指定当网页被第一次调用时应该选择的单选按钮。你也可以在一个网页中根据需要设定多个单选按钮，如果你需要多组单选按钮，只要为每组按钮起个不同的名字就可以了。

建立下拉式列表框

用来代替复选框和单选按钮的另一个方法是建立下拉式列表框来显示一个选择菜单（见图6.8）。下拉式列表框一次只能显示一个选择，要查看别的可能的选项，你可以点击框右边的箭头。使用下拉式列表框的一个好处是它和单选按钮和复选框相比，占用网页上较少的空间。

你可以使用<SELECT>和<OPTION>标识符来建立一个下拉式列表框，象下面的例子：

<HTML>

<HEAD>

</HEAD>

<BODY >

<BR> Please indicate your sex:

<OPTION VALUE=“Is Male”>Male

<OPTION VALUE=“Is Female”>Female

</SELECT>

</FORM>

</BODY>

</HTML>

图6.8 下拉式列表框

在此例中，<SELECT>的NAME属性为你的下拉式列表框提供了一个名字，每一个<OPTION>标识符提供了一个可能的选项。<OPTION>的VALUE属性指定了当选择了此项并按下Submit按钮后应该被提交的值。最后，在<OPTION>标识符后出现的文字决定了这一项在下拉式列表框中怎样显示出来。

此例中的列表框与一组单选按钮的功能一样，你一次只能选择一项。例如，如果你从列表框中选择了Female一项，当按下Submit按钮时，发送的值将是Is Female。这个值将与列表框名sex相关联，你永远也不会一次选择多项。

缺省状态下，跟在第一个<OPTION>标识符后的文字将会成为下拉式列表框的初始值而显示，你可以使用<OPTION>的SELECT属性来改变这一缺省值。在下例中，当列表框出现时，Female被选择了，虽然在选项列表中Male排在Female的前面。

<HTML>

<HEAD>

</HEAD>

<BODY >

<BR> Please indicate your sex:

<OPTION VALUE=“Is Male”>Male

<OPTION VALUE=“Is Female” SELECTED>Female

</SELECT>

</FORM>

</BODY>

</HTML>

指定一个不同的缺省值在某种情况下是很有用的，那就是当你有一个字母顺序的列表，但你想选择列表中的某一个作为它的缺省值。例如，假设你有一个许多图象的列表，但你想让缺省的图象是中国，在这种情况下，你可以使用SELECT属性来指定P.R.China为缺省值，即使这个国家的名字排列在整个字母表的后头。

建立滚动列表框

另一个可代替一组单选按钮及复选框的是滚动列表框（见图6.9）。使用滚动列表框，你可以建立一个选项列表，用户可以从中选择一个或多个选项。你可以使用建立下拉式列表框的标识符来建立一个滚动列表框，只是使用不同的属性。下面是个例子：

<HTML>

<HEAD>

<TITLE> Scrolling List Box </TITLE>

</HEAD>

<BODY >

<BR> Please indicate your sex:

<OPTION VALUE=“Is Male”>Male

<OPTION VALUE=“Is Female”>Female

</SELECT>

</FORM>

</BODY>

</HTML>

图6.9 滚动列表框

<SELECT>的SIZE属性将一个下拉式列表框转变成一个滚动列表框，SIZE属性指定了一次在屏幕上可显示多少选项。

当用滚动列表框代替下拉式列表框时，你失去了节省网页空间的好处。然而，滚动列表框有一个很大的好处。使用滚动列表框，你可以一次选择多个选项，可以使用<SELECT>标识符的MULTIPLE属性来实现这一点：

<HTML>

<HEAD>

<TITLE> Simple Form </TITLE>

</HEAD>

<BODY >

<BR> How did you find out about this web site?

<OPTION VALUE=“Magazine”>Magazine

<OPTION VALUE=“Search”>Search Engine

<OPTION VALUE=“Friend”>Friend

</SELECT>

</FORM>

</BODY>

</HTML>

当这个HTML文件在浏览器上显示时，一个滚动列表框出现在屏幕上，如果你用鼠标在列表框中进行选择的同时按住Ctrl键，你就可以一次选择多个选项。例如，你可同时选择Magazine和Friend（你也可使用Shift键来一次选择相邻的多个选择）。

注意

通常，我不愿使用MULTIPLE实现，原因是许多浏览网页的人不知道如何进行多项选择，而且进行多项选择的方法因各人使用的计算机类型而异。例如，在苹果机上，你要使用Command键而不是Ctrl键。当你想让用户进行多项选择时，考虑使用一组复选框吧。

建立文本区

以前我们讨论的窗体元素中，用户不能输入超过一行的文本，<TEXTAREA>标识符可以建立一个文本区，在这里你可提供给用户更大的空间来自由地输入文本（见图6.10）。当你想让用户输入一段文字的时候就使用这个标识符。看下面的例子：

<HTML>

<HEAD>

</HEAD>

<BODY >

<BR> Please enter your comments below:

</FORM>

</BODY>

</HTML>

图6.10 文本区

你应当立即注意到，在此例中，没有使用<INPUT>标识符来建立文本区，你使用<TEXTAREA>标识符来建立文本区，这个标识符与其它窗体元素一样，必须在<FORM>标识符中出现。

注意

一些浏览器允许你使用下面的语句：

不要这样做，在<INPUT>标识符的属性中建立文本区是没什么好处的。如果你想让你的网页与浏览器有最大程度的兼容性，就使用<TEXTAREA>标识符，不要用TextArea属性。

使用COLS和ROWS属性你可以指定文本区的宽度和高度，COLS属性以列来指定文本区的宽度，ROWS属性以行来指定文本区的高度。注意这两个属性都是以字符平均宽度来度量的，因为文本区不使用固定字体，因此你在一个50列的文本区内不能刚好输入50个字符。

你不能给COLS和ROWS属性指定百分数值，这是很不方便的，因为这使得网页在具有不同分辨率的显示器上看起来不一样，这也是HTML的一个不足。

而且，文本区没有MAXLENGTH属性。没有办法阻止某些用户在文本区内输入大量的文字，对此你一点办法也没有。

注意，<TEXTAREA>标识符是一个容器标识符，如果你想在第一次读入网页时，在文本区显示出文字，那就要将文字包含在<TEXTAREA>标识符内。如下所示：

<HTML>

<HEAD>

</HEAD>

<BODY >

<BR> Please enter your comments below:

I am the default text!

</TEXTAREA>

</FORM>

</BODY>

</HTML>

当这个HTML文件被网络浏览器解释时，文字I am the default text!将在文本区内显示。注意你只能在文本区内输入文字（包括第五章中讨论的特殊字符――见“加入特殊字符”一节）。任何在<TEXTAREA>中出现的HTML标识符都将被忽略。

HTML规范中没有定义文本区内的文字怎样换行，当你在Internet Explorer中在文本区中输入一行文字到达右边界时，文本就会自动换到下一行；而使用Netscape Navigator时，文字会向右滚动。

如果你想在Netscape Navigator中控制文本区内的文字怎样换到新的一行，就要使用Netscape特有的属性WRAP。这个属性可接受三个值：OFF、PHYSICAL和VIRTUAL，缺省值是OFF，即文本不会换到新的一行。另一方面，当WRAP＝PHYSICAL时，文本会自动换到下一行。当文本区的内容被提交时，回车键会被添加到文本换行的地方。如果你想让文本区的文字自动换行，但又不想在提交内容时加入附加的回车键，就可以使用WRAP＝VIRTUAL。

当我建立文本区时，我几乎总是使用WRAP＝VIRTUAL属性。当文本区内的文字不自动换行，将会造成用户输入信息的混乱，通过使用这个属性，我可以确保不管在Microsoft还是Netscape的浏览器上文本区的文字都会自动换行，而且我也不想在解释文本区的内容时处理多余的回车键，因此使用WRAP＝VIRTUAL可做到这一点。

建立隐藏区

使用隐藏区，你可以在永远不在屏幕上显示的窗体中加入一些信息。当然，这些信息在窗体提交时也会被包含。

隐藏区对Active Server Pages程序员来说特别有用，你可能会经常使用它们来在网页之间传递隐藏信息。当然只有当你学习了怎样使用Active Server Pages之后，你才能体会到使用隐藏区的好处。

你可以使用隐藏区来建立不依赖于Cookies的变量，这样做既有优点也有缺点，要了解更多信息，可参阅第16章的“不使用Cookies来保留状态”一节中的“使用Active Server Pages Session”。

下面的例子在窗体中建立了一个隐藏区：

<HTML>

<HEAD>

<TITLE> Hidden Field </TITLE>

</HEAD>

<BODY >

</FORM>

</BODY>

</HTML>

当这个HTML文件在网络浏览器上显示时，你只能在屏幕上看见一个Submit按钮，名为secret的隐藏区并未显示出来。然而当窗体按钮被按下时，值You cannot see me!被作为窗体内容的一部分发送了。

警告

你不要在隐藏区内放置你私人的信息，网页浏览者可使用浏览器的View Source命令看到隐藏区的东西。隐藏区这是隐藏起来不可见，但它们并不能躲过聪明用户的眼睛。

建立文件上载按钮

假设你想建立一个让人们做卖房广告的网点，如果人们能上载他们房子的照片，那将是非常有用的；或者你想建立一个收纳短故事的网点，那也要让人们能上载他们的故事――例如Microsoft Word格式的文件。

理论上，你可以使用<INPUT>标识符的TYPE＝FILE属性来实现这一点，使用这个属性，你可以在窗体上建立一个文件上载按钮（见图6.11）。当你网点的用户点击这个按钮时，他们可以选择一个本地硬盘上的文件进行上载。下面的例子显示了怎样去做：

<HTML>

<HEAD>

<TITLE> File Upload </TITLE>

</HEAD>

<BODY >

<FORM ENCTYPE＝“multipart/form-data”

ACTION=“somedirectory/mypage.asp” METHOD=“POST”>

Please choose a picture to upload:

</FORM>

</BODY>

</HTML>

当这个HTML文件在Netscape Navigator（版本3.0或更高）上显示时，一个普通的文本框显示在一个Browse按钮旁，用户可以直接在文本框中输入文件的名字，或使用Browse按钮来在文件对话框中选择一个文件。当这个窗体被提交后，用户选择的文件也被提交了。

注意这个例子中<FORM>标识符的ENCTYPE属性，它指定了提交时窗体信息的编码方式。通常窗体信息是URL编码的（空格被＋号代替），然而这种编码方法对于非文本的信息是很差的，要想高效地传送一个图象文件，你应当使用ENCTYPE＝“multipart/form-data”。

图6.11 文件上载按钮

实际的文件上载按钮用下述标识符创建：

由于TYPE属性的值是FILE，浏览器就会建立一个文件上载按钮。ACCEPT属性限制了在文件对话框中出现的文件的类型。在此例中，文件类型被限制为图象文件，你可以指定MIME类型中的任意一个或几个作为ACCEPT属性的值。

注意

MIME用于多用途Internet mail扩展。MIME最初被用来作为指定e_mail附属文件类型的的方法，浏览器使用MIME类型来与特定文件相关联。

一些MIME类型的例子是用于GIF图象的image/gif，用于JPEG图象的image/jpeg，用于Microsoft Excel表格的application/x-msexcel，用于Microsoft Word文档的application/msword。

要查看你的计算机支持的MIME类型，可以使用Windows Explorer中的View/Options/File Types命令。

文件上载按钮是非常有用的，然而令人遗憾的是，现在的浏览器软件只支持一部分文件上载按钮，或干脆就不支持。虽然文件上载按钮是HTML 3.2规范的一部分，但这种情况也是存在的。

例如，Netscape Navigator（版本3.0和4.0）忽略ACCEPT属性，Internet Explorer 3.0更糟糕，它完全拒绝解释文件上载按钮，并用一般的文本框代替，而Internet Explorer 4.0能识别文件上载按钮。在文件上载按钮被更多的浏览器软件支持前，要小心地使用它们。