1、第6课 VBScript的对象编程 6.1 课前导读 6.2 课堂教学 6.3 上机练习 6.4 课后作业,6.1 课前导读VBScript是基于对象的程序设计语言，但它并不是真正面向对象的程序设计语言，因为它不具有面向对象的程序设计语言的全部特征。在面向对象的程序设计语言中，程序员可以自己定义对象；而在VBScript中，对象是系统定义好的，可以直接使用。VBScript采用的是面向对象、事件驱动编程机制，因此，必须理解对象以及对象的属性、事件和方法等概念。,6.2 课堂教学6.2.1 对象的属性、事件和方法6.2.2 事件驱动程序设计6.2.3 DHTML对象模型简介6.2.3 DHTML
2、的内部控件,6.2.1 对象的属性、事件和方法1. 对象的概念2. 对象的属性3. 对象的事件4. 对象的方法,VBScript采用的是面向对象、事件驱动编程机制，因此，对象的概念是VBScript最基本的概念之一。 1. 对象的概念在现实生活中，任何一个实体都可以视为一个对象（Object）。如一只气球是一个对象，一台电脑也是一个对象。一台电脑又可以拆分为主板、CPU、内存、外设等部件，这些部件又都分别是对象，因此电脑对象可以说是由多个“子”对象组成的。,对象是具有属性（数据）和方法（行为方式）的实体。属性用于描述对象的一组特征，方法为对象实施一些动作。一个对象建立以后，其操作就通过与该对象
3、有关的属性、事件和方法来描述。VBScript所支持的对象有脚本对象（如Window对象、Document对象、Forms对象等）和DHTML内部控件（Button控件、Text控件等）。,2. 对象的属性在VBScript中，每一种对象都有一组特定的属性。有许多属性可能为大多数对象所共有，如Name属性定义对象的内部名称。还有一些属性只局限于个别对象才有，如只有文本框才有maxLength属性，该属性用来确定用户可以在文本框中输入的字符数,3. 对象的事件事件（Event）就是对象上所发生的事情。在VBScript中，事件是预先定义好的、能够被对象识别的动作，如单击（Click）事件、双击（
4、DblClick）事件、装载（Load）事件、鼠标移动（MouseMove）事件等，不同的对象能够识别不同的事件。当事件发生时，VBScript将检测两条信息，即发生的是哪种事件和哪个对象接收了事件。每种对象能识别一组预先定义好的事件，但并非每一种事件都会产生结果，因为VBScript只是识别事件的发生。为了使对象能够对某一事件做出响应（Response），就必须编写事件过程。,4. 对象的方法对象的方法用于完成某种特定功能。如Window对象的关闭（Close）方法、打开（Open）方法等。每个方法完成某个功能，但其实现步骤和细节用户既看不到、也不能修改，用户能做的工作就是按照约定直接调用它
5、们。方法只能在代码中使用，其用法依赖于方法所需的参数的个数以及它是否具有返回值。调用对象方法的常用格式： 对象名.方法名 参数1, 参数2 如：document.write date( ),6.2.2 事件驱动程序设计,事件过程按其名称被识别，事件过程的命名规则是：on事件名，如Click事件过程名为onclick。事件过程的定义与调用有如下4种方式。(1) 通过标记块实现为每个事件过程分配一个标记块，然后使用标记的event属性调用事件过程，其语法格式为：事件过程代码 ,代码在浏览器中的执行结果。,(2) 在对象定义标记中设置事件过程通过在对象定义标记中设置事件过程可以直接调用事件过程代码，
6、如下面代码：调用事件过程调用事件过程注意：设置onclick属性的值时要用单引号引起来，多个语句之间可以用冒号隔开。,(3) 在对象定义标记中调用事件过程在对象定义标记中设置事件过程属性可以调用命名Sub过程。上述代码可以改为：调用事件过程Sub mysubaa = “这是按钮的单击事件“msgbox aaEnd Sub调用事件过程,代码在浏览器中的执行结果。,(4) 单独定义事件过程这种方式对事件过程的命名有严格的要求，过程名必须是： 对象名_on事件名,通常在脚本的块中定义事件过程，如上述代码可以改为：调用事件过程Sub mybtn_onclickaa = “这是按钮的单击事件“msgbo
7、x aaEnd Sub调用事件过程,代码在浏览器中的执行结果。,6.2.3 DHTML对象模型简介1. Window对象2. Document对象3. History对象4. Navigator对象5. Location对象,6.2.3 DHTML对象模型简介DHTML即动态HTML，所谓的“动态”不仅仅表现在网页的视觉展示方式上，更重要的是，它可以对网页中的内容进行控制与变化。DHTML仍然是以HTML语言为基础，但是相较于过去单纯以HTML来设计网页的方法，HTML所带来的最大转变，在于它加入了“对象化”的网页技术特征。,图6-1 DHTML模型的层次结构,动态HTML对象模型定义了用于描
8、述网页及其内部元素的对象，每个对象都有描述其自身状态的属性和描述其行为的方法，它们也可以处理特定类型的事件。因此，网页设计者可通过Script程序来控制或调用这些对象。,在DHTML模型中最顶层的对象是Window对象，其他对象可以看作是Window对象的属性。其中，对于编程最重要的属性是Document对象。Document对象表示浏览器中当前HTML文档，通过该对象能够获得关于当前文档的信息，可以检测和修改当前HTML文档的元素，还可以响应事件。Screen属性包含了客户端显示器的信息。通常网页设计要考虑到不同的屏幕分辨率，才能让用户看到最佳的效果，因此，需要获得用户显示器的信息，以便动态
9、调整页面。,Frames属性指定由给定文档或者与某个窗口对应文档定义的所有Window对象。这是一个集合属性。它同时也是Document对象的属性。History属性包含用户先前访问过的URLs信息。Navigator属性包含了用户所使用的浏览器的属性，例如浏览器的名称。Location属性包含了关于当前URL的信息。Scripts属性返回当前文档的所有Script块，而不管Script块是在Body块还是在Head块中。而Document对象的Link属性指定了HTML文档中的连接。Anchors属性可以获得文档中的所有超链接。Forms属性是集合属性，返回文档中所有的表单元素。,1. Wi
10、ndow对象Window对象表示浏览器中一个打开的窗口。通过引用该对象的属性可以控制脚本中其他对象的属性，进而控制整个网页的外观以及对事件的响应。使用Window对象可以获得当前窗口的状态信息、文档信息、浏览器的信息，还可以响应发生在IE中的事件。通常，浏览器在打开HTML文档时，创建Window对象。,如果文档中定义了多个Frames对象，则在文档中有多个Frame标记。在这种情况下，浏览器为该文档创建一个父Window对象，为每个Frame标记创建一个子Window对象。父Window对象中发生的操作可以影响子Window对象。如调用父Window对象的Close方法将不只关闭父窗口，所有
11、的子窗口都会关闭。,在脚本程序中使用Window对象的属性、方法、集合时，一般不必标明Window，而直接使用。比如，关闭窗口时，可以用代码Close，而不必写为：Window.Close。只是为了增加程序的可读性，建议用户标明Window对象。,下面分别介绍Window对象常用的属性、方法和事件，(1) Window对象的属性Window对象有多个属性，通过这些属性可以得到客户端浏览器属性，可以控制当前窗口的HTML文档等等。,表6-1 Window对象的属性,说明：, 使用Self属性就可以显式地引用当前Window对象或者Frame对象的方法，从而避免因表单与Window对象重名引起的歧
12、义，提高脚本代码的可读性。 可以用如下代码在浏览器状态栏中提示用户正在加载网页： Window.status = “正在加载网页“把上述代码放在load事件过程中，就能够使用户看见提示信息。, 使用event对象时必须标明Window对象：Window.event。Event对象的属性有：button、altKey、ctrlKey、shiftKey、toElement、fromElement、returnValue、keyCode等等，用于返回事件发生时相应对象的状态、鼠标和键盘的状态。,(2) Window对象的方法Window对象的方法用于显示提示信息、输入信息、控制HTML页面外观、触发
13、和响应事件、显示HTML页面等。,说明：, Alert方法有些类似于MsgBox函数产生的对话框，只是Alert产生的含有图标，而且对话框标题为“Microsoft Internet Explorer”；前者不含有图标，对话框标题为“VBScript”。注意，用户无法更改使用该方法产生的对话框标题。 Confirm方法与Alert、MsgBox产生的对话框不同，该方法产生的对话框有两个按钮，而且有返回值。单击“确定”按钮，该方法返回值为True；单击“取消”按钮，该方法返回值为False。注意，无法更改使用该方法产生的对话框标题。, Prompt方法的语法如下： Prompt(message,
14、 inputDefault)其中，message是可选参数，是显示提示信息的字符串；InputDefault也是可选参数，显示缺省输入值。如果不指定InputDefault参数，那么，对话框的输入框中将显示“undefined”字样。该方法的返回值为用户输入的字符串。与Alert、MsgBox一样，该方法产生的对话框标题无法更改。, SetTimeout方法的语法如下： SetTimeout(“命令或过程“, 毫秒数)其作用是在指定的时间（毫秒数）后执行指定的“命令或过程”。, open方法的语法如下： window = 对象名.open(URL, name, features , repla
15、ce)其中，URL参数指定了新窗口要加载的HTML文档。如果不指定URL参数，则加载一个空HTML文档。name参数是可选的，用来指定新窗口的名称，以便别的HTML文档通过超链接调用。Features参数是可选的，用于指定新窗口的样式，有多个选项可以选择.,表6-3 Features参数的取值说明,replace参数也是可选的，可以设置为yes或者no，用于指定加载的URL在浏览器历史记录中，是否替换原窗口的URL记录。例如，可以用如下代码打开一个窗口： Window.Open “titile.htm“下述代码打开一个名为title.htm的文档，新窗口不指定名称，显示工具栏，显示“链接”工具
16、栏： Window.Open “titile.htm“, null, “fullscreen = no, toolbar = yes, directories = yes“,(3) Window对象的事件Window对象的事件分为：与加载或卸载网页有关的、与窗口状态有关的，与窗口中事件处理有关的。这些事件中常用的有load、unload、resize。Load事件与Unload事件分别发生于网页的加载或卸载时，它们界定了一个HTML文档的生命期。Load事件在IE加载给定对象后立刻发生。该事件过程应在标记中声明。在网页的Load事件处理函数中可以对网页做一些初始化工作，或者显示一些信息。例如，
17、下面的代码可以在加载网页时显示对话框说明已经触发了Load事件。,Load事件过程Sub init() MsgBox “正在加载网页，触发了Load事件“End Sub, resize事件发生在用户调整浏览器窗口大小时，可以在其事件过程中重新安排页面中各要素的显示位置和尺寸，以便增加网页对用户操作的敏感性，使交互界面更友好。, Unload事件是在IE关闭该网页时触发。可以在该事件过程中添加代码，保存有用的用户信息。比如，在进行网上购物时，可以在网页的Unload事件过程中，统计购物的种类和数目等等。下面的代码可以在关闭网页时显示对话框说明已经触发了Unload事件。,unLoad事件过程Su
18、b Leaving()MsgBox “正在离开网页，触发了Unload事件“End Sub,2. Document对象Document对象代表了当前浏览器窗口中的HTML文档，它是脚本对象模型中最为重要的对象。可以通过该对象检测HTML文档中各元素的状态（比如，颜色、字体，发生的事件等），并且可以更改这些元素的状态。在HTML文档的任何位置都可以调用该对象。,下面分别介绍Document对象常用的属性、方法和事件。(1) Document对象的属性在Document对象的属性中，有些是用来设置当前HTML文档的状态，有些则是用来指示当前URL的信息。,表6-4 Document对象的属性,Co
19、okie是由浏览器读取或写入硬盘的文本文件，存放在特定的文件夹中。Cookie可以存放用户名和选项等配置信息，使得下一次请求同一页面时，脚本能找到上次存放在客户机上的数据，以调整用户配置。通常用cookie来保存服务器发送来的字符串，以便在页面之间共享信息。在VBScript 中，可以使用如下代码把该属性值设为指定值，然后显示出来： document.cookie =“color=Yellow“ MsgBox(document.cookie),(2) Document对象的方法Document对象提供了多种方法控制网页的读写以及外观。,说明： 与window对象的Open方法不同，Docume
20、nt对象的open方法只是在当前浏览器窗口新建一个HTML文档，前者则新建一个浏览器窗口。在动态更改网页操作中，一般先调用open方法在浏览器窗口中打开一个空的文档，然后，通过调用write或者writeln方法在文档中输入新的内容，然后，调用close方法关闭文档并显示它。, write方法和writeln方法的区别在于writeln方法在输出字符串末尾添加了回车标志。,(3) Document对象的事件Document对象的事件中常见的有：click，dblclick、keydown、keypress、keyup、mousedown、mouseover、mouseout、mouseup等。
21、在文档中与Document对象相对应的HTML标记是，所以，调用Document对象的事件过程时要在标记中添加代码。,3. History对象History对象包含了用户访问过的URL信息，通过这些信息可以使浏览器具有导航功能，使得用户可以很方便地在感兴趣的URL之间切换。History对象不出现在网页上，因而没有对应的事件，只有一些属性和方法。以下分别介绍History对象常用的属性、方法。(1) History对象的属性History对象只有一个Length属性。该属性返回用户访问过的URL个数。该属性只读，在程序中不能对它进行赋值操作，使用频率并不高。,(2) History对象的方法H
22、istory对象的方法用于在URL历史记录中移动，从而改变当前URL。它有三个方法:back方法，forward方法和go方法。back方法。该方法用于回溯浏览内容，等效于用户在浏览器中单击n次“后退”按钮。其调用形式如下： History.back n其中，参数n指定在URL历史记录中回溯URL的个数。例如： window.history.back 1该语句使得当前文档切换到最近一次访问过的URL。,forward方法。该方法用于显示URL历史记录表中下一个URL的内容，等效于用户在浏览器中单击n次“前进”按钮。其调用形式如下： History.forward n其中，参数n指在历史记录表中
23、前移URL的个数。go方法。该方法用于显示URL历史记录表中特定URL的内容。其调用形式如下： History.go(delta | location)其中，参数delta是个整数，指定目标URL的相对位置。参数location是个字符串，指定目标URL的一部分或者全部。说明：当参数delta为1时，相当于执行语句：History.forward 1。当参数delta为-1时，相当于执行语句：History.back 1。,4. Navigator对象Navigator对象包含了客户端浏览器的信息，通过引用该对象的属性可以得到这些信息，在大多数情况下，客户端使用的浏览器类型是无法事先知道的。这
24、就要求HTML文档能够适应多种浏览器的特性，比如可能需要它同时适用于IE和Netscape浏览器。而事实上，浏览器之间的兼容性并不好。为此，我们可以设计两组页面，每组页面对应一种浏览器，由脚本程序判断页面是由哪种浏览器打开的，然后根据浏览器的信息打开相应的页面，以便用户获得最佳的浏览效果。Navigator对象不出现在网页上，因而没有对应的事件，只有一些属性和方法。,(1) Navigator对象的属性Navigator的属性包含了浏览器的名称、版本、设置等。其中，较为常用的属性有appCodeName、appName，appVersion、cookieEnabled等。appCodeName
25、属性。通过该属性可以得到浏览器类型代号。例如，对于IE来说，该属性的返回值为“Mozilla”。appName属性。通过该属性可以得到浏览器类型名称。例如，对于IE来说，该属性的返回值为“Microsoft Internet Explorer”。,appVersion属性。通过该属性可以得到浏览器的版本号。cookieEnabled属性。由于cookie可以存放一些有用的用户信息，所以，判断浏览器是否支持cookie很有用处。(2) Navigator对象的方法Navigator对象支持两个方法：javaEnabled和taintEnabled。其中，前者可以用来确定浏览器是否支持java编程
26、语言。这样，脚本程序可以利用这条信息动态调整代码。对于不支持java的，程序中原来用java的部分，可以用VBScript代码实现。后者可以用来确定浏览器是否支持数据tainting。,5. Location对象Location对象包含了当前URL的信息。该对象不支持方法和事件。在其属性中，最常用的有href、pathname、search等属性。href属性。该属性用来返回或者设置当前完整的URL。通过该属性，能够实现网页间的少信息传递。同时，通过在脚本代码中改变该属性可以实现网页的动态切换。例如，可以用如下代码指定当前窗口的URL： Window.Location.href =“http:
27、/“href属性是Location对象的缺省属性。也就是说，下属代码等价： Location = “/chap3/docExample.htm“ Location.href = “/chap3/docExample.htm“,pathname属性。该属性可用来设置当前文档的路径，通过它能够调用Web根目录以外的文档。search属性。该属性用来返回URL中嵌入的参数，通过参数来实现网页间的信息交互。这种方式比起使用服务器端对象要简单一些。在URL中嵌入参数的方法是在URL后面加一个问号(?)，然后紧跟参数名称和参数值。例如： http:/www.SomeS DHTML的内部控件 1. 通用的属
28、性、事件和方法 2. Button控件 3. Text控件 4. Password控件 5. Radio控件 6. Checkbox控件 7. Image控件 8. File控件 9. Submit控件和Reset控件 10. Hidden控件 11. Select控件 12. TextArea控件,6.2.3 DHTML的内部控件DHTML（Dynamic Hyper Text Markup Language）是HTML的增强版，通过扩充IE对象并结合VBScript或JScript而组成，与HTML的区别是DHTML的每个标记都作为对象处理。DHTML的内部控件是其预制的对象，由客户端浏览
29、器直接提供，无需从服务器上下载。可以使用、和等标记在网页中添加DHTML的内部控件。其中，标记和标记分别添加列表框和多行文本区控件，而标记则可以在网页中添加多种DHTML控件，如第4、5课中的例题所示。,标记的语法结构如下：说明： name属性指定控件的名称，用于在代码中引用该控件。 type属性指定控件的类型，其取值与对应的控件说明见表6-6。 language属性指定控件的事件代码所使用的脚本语言名称，取值如VBScript或JScript。格式中还包括其他一些属性，这些属性中有些是少数控件所特有的，有些则是控件所共有的，即通用的属性。,表6-6 type属性的取值说明,1. 通用的属性、
30、事件和方法(1) 通用属性常用的通用属性有：Disabled属性、Style属性、Title属性、Value属性等。其说明见表6-7。 表6-7 内部控件的通用属性,【例6-1】通用属性的使用。在记事本中编写代码如下：通用属性的使用通用属性的使用请输入文本：If Button1.value = “改变“ thenButton1.style.fontFamily = “隶书“Button1.style.fontSize=24Text1.disabled = FalseButton1.title=“可以修改文本“Button1.value = “还原“Else,Button1.style.font
31、Family = “宋体“Button1.style.fontSize=18Text1.disabled = TrueButton1.title=“不能修改文本“Button1.value = “改变“End If在浏览器中执行代码，显示结果。,(2) 通用事件通用事件是指大多数控件都能响应的事件。通用事件的说明见表6-8,表6-8 内部控件的通用事件,【例6-2】响应鼠标事件。在记事本中编写代码如下：使用鼠标事件使用鼠标事件Text1.value = “我被单击了“Text1.Value = “鼠标指向了我“Text1.Value = “鼠标按下了“Text1.Value = “鼠标离开了“
32、,在浏览器中执行代码，显示结果。,【例6-3】响应键盘事件。在记事本中编写代码如下：使用键盘事件使用键盘事件按键：控制键：ASCII码：键值：Text3.value =window.event.KeycodeText1.Value = “Text2.Value = “Text4.value = keycodekeycode=window.event.Keycodealt=window.event.altKeyCtrl=window.event.CtrlKeyShift=window.event.ShiftKey,Select Case TrueCase AltText2.value = “Al
33、t“Text1.Value = chr(keycode)Case CtrlText2.value = “Ctrl“Text1.Value = chr(keycode)Case ShiftText2.value = “Shift“Text1.Value = chr(keycode)End selectSelect Case TrueCase keycode=13Text1.Value = “回车键“Case keycode=8Text1.Value = “退格键“Case keycode=27Text1.Value = “ESC“End select,在浏览器中执行代码，显示结果。,说明： 在键
34、盘事件中，VBScript通过Window对象的Event属性接受按键的ASCII码值（Keypress事件）或键值（Keydown事件和Keyup事件）。 Window对象的Event属性返回对Event子对象的引用，引用的格式为： key = window.event.Keycode Event子对象的常用属性见表6-9 表6-9 vent子对象的常用属性,(3) 通用方法这里只介绍Focus方法。Focus方法使得控件获得焦点，其语法格式为： 控件名.Focus 2. Button控件Button控件又称为命令按钮，通常用来响应用户的命令。Button控件支持大多数的通用属性和事件，其特
35、有的属性有以下几种。, ReadOnly属性，返回或设置控件状态为只读。与Disabled属性不同的是，ReadOnly属性允许控件接受焦点。可以在标记或代码中使用 OuterText属性，取值为字符串，用于将控件动态地更新为该字符串文本。如下述代码将按钮Button1改为文本“欢迎进入聊天室”： Button1.OuterText = “欢迎进入聊天室“ OuterHTML属性，取值为字符串或HTML标记（除、以外）。如下述代码将按钮Button1改为Text文本框控件： Button1.OuterHTML = “,3. Text控件Text控件又称为文本框，通常用来接收用户的输入或输出提示
36、信息。Text控件支持大多数的通用属性和事件，其特有的属性有以下几种。 MaxLength属性，用于返回或设置用户可以输入的字符数。可以在标记或代码中使用。 Size属性，用于返回或设置文本框的宽度。可以在标记或代码中使用。Text控件所特有的事件有： Chang事件，改变文本内容，并转移焦点时触发该事件。 Select事件，选择文本内容时触发该事件。,【例6-4】响应Chang事件。在记事本中编写代码如下：文本框的内容文本框的内容请输入文本：Msgbox “文本框中的内容是：“ & Text1.ValueButton1.outerhtml = “文本框中的内容被改变了“Chang事件的使用情
37、况。,4. Password控件Password控件与Text控件类似，只是它不显示文本的内容，通常用于验证口令。当用户输入口令时，键入的字符都以星号（*）出现。Password控件所支持的属性和事件与Text控件也大致相同。 5. Radio控件Radio控件又称为单选按钮。一般来说，单选按钮总是作为一个组（单选按钮组）的组成部分工作的。单选按钮组是一组相互排斥的单选按钮，选择一个单选按钮就会立即清除该组中的其它按钮。在单选按钮组中只能单击一个选项，这与收音机上按钮的作用相似，故又称收音机按钮。,单选按钮支持常用的通用属性和事件，其特有的属性是Checked。Checked属性用于返回或设置
38、单选按钮的状态，其取值为True或False。若属性值为True，则该单选按钮处于被选中状态；若为False（默认），则处于未选中状态。可以使用控件的ID属性来区别单选按钮组中的按钮，也可以通过使用下标来区别如下例所示。【例6-5】使用单选按钮组。在记事本中编写代码如下：使用单选按钮使用单选按钮,宋体黑体隶书楷体select case truecase Radio(0).checkedText1.Style.fontFamily = “宋体“case Radio(1).checkedText1.Style.fontFamily = “黑体“case Radio(2).checkedText1.
39、Style.fontFamily = “隶书“case Radio(3).checkedText1.Style.fontFamily = “楷体_GB2312“end select在浏览器中执行代码，显示情况。,6. Checkbox控件CheckBox控件又称为复选框，其功能与单选按钮相似，就像一个开关，用于表明某个特定状态是选定（ON）还是未选定（OFF）状态。与单选按钮不同的是，可以同时选中多个复选框。复选框所支持的属性和事件与单选按钮相同，其Checked属性用于返回或设置单选按钮的状态。【例6-6】使用复选框。在记事本中编写代码如下：使用复选框使用复选框,斜体粗体下划线删除线If c
40、hk(0).checked ThenText1.Style.Fontstyle = “italic“ElseText1.Style.Fontstyle = “normal“End IfIf chk(1).checked ThenText1.Style.Fontweight = “bold“ElseText1.Style.Fontweight = “normal“End IfText1.Style.TextdecorationUnderline = chk(2).checkedText1.Style.TextdecorationlineThrough = chk(3).checked,在浏览器中
41、执行代码，显示情况。,7. Image控件Image控件用于显示图形信息，就像HTML中的IMG标记，其属性也类似。不同的是可以在代码中通过“控件名.x”和“控件名.y”来设置或得到该控件的x和y坐标。与IMG标记的最大不同应该是Image控件可以响应事件，Image控件支持多数的通用事件。 8. File控件File控件提供一个文本框和一个浏览按钮，用于查找文件。单击浏览按钮，打开“查找文件”对话框，找到的文件及其路径名将显示在文本框中。File控件的value属性将返回找到的文件及其路径名。File控件支持多数的通用属性和事件。,9. Submit控件和Reset控件这两个控件须和标记一起
42、使用，分别提供“提交”按钮（Submit控件）和“取消”按钮（Reset控件）。单击“提交”按钮，将会向一个后端过程提交表单中的内容；单击“取消”按钮，则清除当前表单中的所有输入信息。Submit控件和Reset控件支持多数的通用属性和事件。,10. Hidden控件Hidden控件也须和标记一起使用，用于存放用户信息。它在浏览器中是隐含的，其value属性可以作为表单的内容提交给后端过程。Hidden控件支持多数的通用属性，其支持的事件只有两个：afterupdate（提交后）事件、beforeupdate（提交前）事件和errorupdate（提交错误）事件。,11. Select控件Se
43、lect控件又称为列表框。当浏览者选择的项目较多时，如果用单选按钮来选择，占页面的区域就会较多，此时可以使用列表框。可以用标记和标记来设置列表框，其格式为：选项文本1选项文本2 ,说明： 标记定义列表框（Select对象），而标记定义列表框中的选项（Option对象）。 列表框支持常用的通用属性和事件，其特有的属性见表6-4。 表6-4 列表框的属性, Option对象的属性取值见表6-5。 表6-5 Option对象的属性取值, 列表框对象至少包含一个选项（Option对象）【例6-7】使用列表框。在记事本中编写代码如下：使用列表框使用列表框北京上海天津,重庆列表框中的选项个数：选定项的Va
44、lue值为：选定项的text值为：i=select1.selectedindextext1.value=select1.lengthtext2.value=select1.options(i).valuetext3.value=select1.options(i).text,在浏览器中显示效果。说明：size属性默认值为1，Select控件只显示一行，即为下拉式列表框，此时style属性的高度定义无效。若size=x（1），则Select控件可显示多行，为列表框，其高度为x行，如果设置了style属性的height子属性，则高度由height子属性值决定。,【例6-8】在例6-7中使用size
45、属性。修改代码如下：使用列表框使用列表框北京上海天津重庆列表框中的选项个数：选定项的Value值为：选定项的text值为：i=select1.selectedindextext1.value=select1.lengthtext2.value=select1.options(i).valuetext3.value=select1.options(i).text,在浏览器中显示效果。,12. TextArea控件TextArea控件又称为多行文本框。在意见反馈栏中往往需要浏览者发表意见和建议，提供的输入区域一般较大，以便输入较多的文字。使用标记可以设置多行文本框，其格式为： 说明： 行数和列数是
46、指不用滚动条就可看到的部分。 在之间的内容是文本框的初始值，为多行文本框的value属性值。,【例6-9】使用TextArea控件。在记事本中编写代码如下：使用多行文本框使用多行文本框这是文本框中的初始值msgbox texa.value在浏览器中显示效果。,6.3 上机练习【练习6-1】使用window对象的方法、属性和事件设计的倒计时器。在记事本中编写代码如下：计时器 定义一个显示剩余时间的子程序Public m,qq=1Sub tick(k)m=k-1t1.value = TimeSerial(0,0,m)if m =0 or q=0 thenexit subend if,window.
47、settimeout “tick(m)”,1000 设定执行函数tick()的 定时间隔为1秒End Sub计时器剩余时间：q=0在浏览器中执行代码，显示结果。,【练习6-2】使用Document对象与History对象。在记事本中编写代码如下：使用document的方法Sub mybtn_onclickdocument.writeln “使用history的方法“document.writeln “这是新文档的内容“document.writeln “单击按钮将返回“document.write“document.title=“使用history的方法“End Sub使用document的方法在浏览器中显示效果。,
