Form[]对象
一个表单隶属于一个文档,对于表单对象的引用可以通过使用隶属文档的表单数组进行引用,即使在只有一个表单的文档中,表单也是一个数组的元素,其引用形式如下:
Document.forms(0)
注意:表单数组引用是采用form的复数形式forms,数组的下标总是从0开始。
在对表单命名后,也可以简单地通过名称进行引用,比如,如果表单的名称是MyForm,则引用形式如下所示:
Document.MyForm
如果在一个表单中有多个表单元素具有相同的名称,那么,VBScript会自动创建一个数组来存放这些元素,数组中的每个元素代表一个表单元素。例如,在一个表单中有一个文本框和一个文本区名称都是MyName,那么MyName(0)和MyName(l)分别代表文本框和文本区,数组的下标从0开始,表单元素的下标和它们在表单中出现的顺序是一致的。
1.表单对象的属性、方法与事件
表单对象的属性、方法与事件如表3-17所示,有关它们的具体解释我们随后马上展开。
表3-17 表单对象的属性、方法与事件
属性 方法 事件
action HandleEvent() OnReset
elements() Reset() OnSubmit
encoding Submit()
length 
method 
name 
target 
2.属性
(1)action
action属性指明了通讯的HTTP服务器的ASP程序的URL地址。例如:
Document.forms(0).action=" http://127.0.0.1/MyWeb/test.asp"
(2)method
一个表单的method取值可以是GET或者POST,method的值说明了访问HTTP服务器的访问方法。
(3)name
name属性指明了表单的名称,可以通过name属性的值对表单进行引用。
(4)target
target属性在Frame结构下发挥了重要的作用。在Frame结构下,有时会希望保留交互表单的Frame部分,而使用另外的Frame部分进行浏览。target属性指明了响应页面应该在Frame的哪一部分进行显示。target属性值可以是窗口名称或者Frame名称,分别代表用以显示反馈信息的窗口或者Frame。
例如,假设在Frame结构中,使用frameLeft进行交互查询,使用frameRight进行浏览,则可以对target属性进行设置:
Document.forms(0).target="frameRight"
3.方法
方法共有2种情况。
(1)reset()
reset()方法将表单中所有元素值重新设置为缺省状态,如果在表单中定义了Reset按钮,那么,reset()方法执行后的效果与单击Reset按钮的效果是相同的。
(2)submit()
submit()方法将表单数据发送给服务器的ASP程序处理,如果在表单中定义了Submit按钮,则submit()方法执行后的效果与单击Submit按钮效果是相同的。                                  图3-12 用图片代替按钮示例
例如,在生动活泼的Web页面中,使用美观的图片代替Reset按钮和Submit按钮往往会取得更好的效果,在这里,就需要使用到reset()方法和submit()方法,如例3-47所示。
<HTML><HEAD><TITLE>注册</TITLE></HEAD><BODY>
<FORM METHOD=POST ACTION=" http://127.0.0.1/MyWeb/test.asp">
请输入你的姓名
<INPUT TYPE="text" Name="RegisterName"><BR>性别
<INPUT TYPE="radio" Name="Gender" VALUE="male" CHECKED>先生
<INPUT TYPE="radio" Name="Gender" VALUE="female">女士<BR>
</FORM>
<IMG SRC="submit.jpg" οnclick="Document.forms(0).submit()">
<IMG SRC="reset.jpg" οnclick="Document.forms(0).reset()">
</BODY></HTML>
例3-47 使用reset()方法和submit()方法利用美观的图片代替Reset按钮和Submit按钮

text文本框对象
文本框对象是表单中接收用户输入数据的主要媒介,由于文本框对象中输入文本的内容千变万化,往往需要对文本框中输入数据进行数据有效性验证,特别是对于整数和实数的输入也往往使用文本框,对于这一类型的输入,有效性验证则更为必要。
1.文本框对象的属性、方法和事件
文本框对象的属性、方法和事件如表3-18所示,后面我们会详细介绍它们。
             表3-18文本框对象的属性、方法和事件
属性 方法 事件
DefaultValue Blur() OnBlur
Form Focus() OnChange
Name handleEvent() OnFocus
Type select() onKeyDown
Value   OnKeyPress
   OnKeyUp
   OnSelect
2.属性
文本框对象的属性共有下述5种。
(1)defaultValue
defaultValue的属性值是文本框中缺省的文本信息。
(2)form
form属性反映了包含该文本框的表单。通过文本框的form属性可以对表单进行引用。
(3)name
name属性即为文本框的名称。
(4)type
type属性指明了表单元素的类型,文本框的type属性值是text。
(5)value
value属性就是文本框的当前输入信息,即文本框中当前正在显示的文本。
例如,假设表单中有一个文本框,名称为Upper,在表单数据提交前要先将Upper中的文本全部转化为大写文本;那么,我们可以先定义ToUpper()函数,ToUpper ()函数将文本框中文本转换为大写文本。在提交之前先调用ToUpper()函数进行处理:
<HTML><HEAD><TITLE>请输入非负数字</TITLE>
<SCRIPT LANGUAGE="VBScript">
<!--
function ToUpper()
Document.forms(0).Upper.value=UCase(Document.forms(0).Upper.value)
'使用VBScript的UCASE函数将小写字母转换成大写字母。
End function
-->
</SCRIPT></HEAD><BODY>
<FORM METHOD=POST
ACTION="http://127.0.0.1/MyWeb/test.asp">
<INPUT TYPE="text" Name="Upper">
<INPUT TYPE="button" value="提交" OnClick="ToUpper()">
</FORM></BODY></HTML>
例3-48 将小写字母转换成大写字母
3.方法
(1)blur()
blur()方法可以释放表单元素的输入焦点,对于文本框而言,blur()方法的执行会取消文本框内文本的选顶,并且在文本框中的文本插入指针也会离开文本框。
例如,表单中有一个文本框,名称为Modify,可以使用blur()方法使之失去输入焦点;
Document.forms(0).Modify.blur()
(2)focus()
focus()方法和blur()方法相反,会使得表单元素获得输入焦点,对于文本框而言,focus() 方法的执行会使得文本插入指针处于文本框中。
在提交表单数据前需要进行数据有效性验证,而一旦数据有效性验证失败后,用户往往需要对输入有误的表单元素进行修改,这样,就有必要将输入焦点置于输入有误的表单元素上,使得用户能够直接进行修改,而不必先在表单中找到需要修改的表单元素,从而可以便于用户的操作,这对于长表单的输入是十分有意义的。
(3)select()
select()方法使得文本框中文本被选中,即突出显示文本框中的文本。
在数据有效性验证失败后,先使用focus()方法将焦点置于输入有误的表单元素上,如果表单元素是文本框,则往往也需要将文本框中的文本选中,这样,用户可以按Delete键直接删除文本框中输入有误的数据,这样,也可以有效地简化用户的操作步骤。
我们用例3-49说明,在文本框中要求输入一个非负整数,如果有效性验证失败后则使文本框获得焦点,并且文本框中的输入数据被选中。
<HTML><HEAD><TITLE>请输入非负数字</TITLE>
<SCRIPT LANGUAGE="VBScript">
<!--
function check()
   for i=1 to len(trim(Document.forms(0).number.value))
     c=mid(trim(Document.forms(0).number.value),i,1)
      If(c<"0" or c>"9") then
          alert ("请输入非负数字")
          Document.forms(0).number.focus()
          Document.forms(0).number.select()
          exit for
      else
          Document.forms(0).submit
      End If     
   next
End function
-->
</SCRIPT></HEAD><BODY>
<FORM METHOD=POST
    ACTION="http://127.0.0.1/MyWeb/test.asp" >
请输入非负的数字<INPUT TYPE="text" Name="number">
<INPUT TYPE="button" value="提交" οnclick="check()">
</FORM></BODY></HTML>
    例3-49 数据有效性验证失败后文本框获得焦点,其中输入数据被选中
4.事件
(1)OnBlur
在文本框失去焦点时,触发OnBlur事件。如果需要对某个文本框的输入数据进行严格的数据有效性验证,可以在OnBlur事件处理函数中检验,对例3-49中我们进行如下修改:
<INPUT TYPE="text" Name="number" OnBlur="check()">
这样,一旦当名称为number的文本框失去焦点后立刻进行校验,如果不是合法的整数,则将焦点重新设置到number文本框中,那么在该文本框中根本就不可能输入不合法的数据,否则文本框就不能失去焦点,当然也就不可能提交表单数据了。
(2)OnChange
OnChange事件和OnBlur事件相似,都要在失去焦点之后触发,不同之处在于,只有当用户修改了文本框中的文本,然后失去焦点后才触发,如果用户没有修改文本,失去焦点 时是不会触发OnChange事件的,同样可以在OnChange事件处理函数中进行数据有效性验证,在例3-49可以进行如下修改:
<INPUT TYPE="text" Name="number" OnChange="check()">
和OnBlur不同,在OnChange事件处理函数中进行校验不会把焦点强制定于该文本框 中,如果在number文本框中输入了不合法的数据,出现警告对话框后会将焦点重新设置到number文本框中,此时如果不进行任何改动,可以将焦点移动到其他表单元素上而不再次触发OnChange事件处理函数。
建议不要使用OnBlur事件处理函数中进行数据有效性验证,而是使用OnChange事件处理函数中进行验证,然后在表单提交时再进行一次验证,这样可以给予用户较大的自由。
(3)OnFocus
当文本框得到焦点时,触发OnFocus事件。
(4)OnSelect
当文本框中文本被选定时,触发OnSelect事件。
(5)OnKeyDown
文本框在获得焦点的状态下,用户按下一个键时触发OnKeyDown事件。
(6)OnKeyUp
文本框在获得焦点的状态下,用户松开一个键时触发OnKeyup事件。
(7)OnKeyPress
文本框在获得焦点的状态下,用户按键动作完成之后出发OnKeyPress事件,所以在用户按键的过程中先触发OnKeyDown事件,然后触发OnKeyUp事件,在OnKeyDown事件和OnKeyUp事件匹配完成之后触发OnKeyPress事件。
这样,就可以修改例3-49,在例3-49中的校验方式是对于输入文本进行校验,这是一种被动的校验方式,其实可以考虑采用一种更加主动的校验方式,通过编写OnKeyPress事件处理函数后,可以保证在文本框中只能输入数字,而屏蔽了其他按键,这样同样保证了在number文本框中只能输入数字。如例3-50所示(该例使用了多个事件,建议读者将其分开一个一个测试)。
<HTML><HEAD><TITLE>请输入非负数字</TITLE>
<SCRIPT LANGUAGE="VBScript">
<!--
function init()
   Document.forms(0).number.value="请输入非负数字"
   Document.forms(0).number.select()
End function
function clear()
   Document.forms(0).number.value=""
End function
function inputed()
     for i=1 to len(trim(Document.forms(0).number.value))
     c=mid(trim(Document.forms(0).number.value),i,1)
      If(c<"0" or c>"9") then
          alert ("请输入非负数字")
          Document.forms(0).number.focus()
          Document.forms(0).number.select()
          exit for
      End If     
   next
End function
function check()
   charstr=Document.forms(0).number.value
   If not isnumeric(charstr) then
       alert "请输入非负数字"
   else
       Document.forms(0).submit
   End If   
End function
-->
</SCRIPT></HEAD><BODY>
<FORM METHOD=POST
    ACTION="http://127.0.0.1/MyWeb/test.asp" >
请输入非负的数字<INPUT TYPE="text" Name="number"
οnfοcus="clear()" οnblur="check()" οnmοuseοver="init()"
οnkeypress="inputed()">
</FORM></BODY></HTML>
    例3-50 通过屏蔽非数字按键主动进行校验

textarea文本区对象
虽然文本区对象和文本框对象在HTML格式上有较大的差异(文本区对象使用<TEXTAREA>标签,而文本框对象使用<INPUT>标签),但从VBScript的角度来看,它们在属性、方法与事件上是一致的,不同之处只是文本区对象的type属性值为textarea。

password口令对象
口令对象和文本框对象十分相似,不同之处只在于在口令对象中,输入文本不会直接显示出来,而是以星号代替。它的属性、方法与事件和文本框对象是一致的。不过,它的type属性值为password。

Radio、checkbox单选框对象和复选框对象
1.单选框的属性、方法和事件
使用单选框时,一组单选框采用相同的名称,这样在一个时刻,一组单选框中只能选择一项。在VBScript中,如果多个元素具有相同的名称,就会形成一个数组,通过循环访问数组中的每一个元素就可以对每个单选框进行访问。
表3-20 单选框的属性、方法和事件
属性 方法 事件
Checked blur() OnBlur
Defaultchecked click() OnClick
form focus() OnFocus
name handleEvent() OnMouseDown
type   OnMouseUp
value 
2.属性
(1)checked
checked属性反映了单选框的状态,即选中或者不选中。
在例3-52中,页面上有一组单选框,代表4个不同类型的旅游地点,当用户选择某个旅游地点后单击名称为change的按钮,则在名称为favor的文本框中显示用户选择的旅游地点。
<HTML><HEAD><TITLE>我喜爱的地方</TITLE>
<SCRIPT LANGUAGE=VBScript>
<!--
sub likeit()
    for i=0 to Document.forms(0).place.length-1
If Document.forms(0).place(i).checked then
            Document.forms(0).favor.value= _
Document.forms(0).place(i).value
        End If
    next
End sub
-->
</SCRIPT></HEAD><BODY>
<FORM>
<INPUT TYPE="text" Name="favor"><BR>
请选择你喜欢的旅游地点:<br>
<INPUT TYPE="radio" Name="place"
VALUE="新加坡">新加坡<BR>
<INPUT TYPE="radio" Name="place"
VALUE="泰国">泰国<BR>
<INPUT TYPE="radio" Name="place"
VALUE="马来西亚">马来西亚<BR>
<INPUT TYPE="radio" Name="place"
VALUE="欧洲">欧洲<BR>
<INPUT TYPE="button" Name="change"
VALUE="选择" OnClick="likeit()">
</FORM></BODY></HTML>
    例3-52 单击按钮将选择的旅游地点写入文本框中
(2)defaultchecked
defaultchecked属性说明了在一组单选框中哪一个单选框在缺省状态下是选中的。
(3)form
form属性反映了包含单选框的表单。
(4)name
name属性即为单选框的名称,一组单选框应该具有相同的名称。
(5)type
单选框的type属性为radio。
(6)value
value属性是描述单选框的相关信息,和按钮、文本框不同的是,单选框的value属性并不在表单上显示,需要在单选框外另外加入描述信息,单选框的value属性值可以和单选框外的描述信息不同,简便起见,往往设置单选框的value属性值和描述信息相同。
3.方法
共有3种,其中blur()方法用于释放单选框的焦点;单选框的click()方法可以模拟单选框的单击动作,但并不触发单选框的OnClick事件处理函数;另外,focus()方法可使单选框获得焦点。
4.事件
(1)OnBlur
当单选框失去焦点时,触发OnBlur事件。
(2)OnClick
鼠标单击单选框时,触发OnClick事件,和按钮一样,OnClick事件也是OnMouseDown事件和OnMouseUp事件的结合。一般处理鼠标单击单选框时,使用OnClick事件处理函数。
如例3-53所示,对于例3-52我们可以进行进一步改进。在例3-52中,按钮只是起到了触发事件的作用,可以使用每个单选框的OnClick事件代替按钮的作用,在单选框的OnClick事件处理函数中将旅游地点写入文本框中。
<HTML><HEAD><TITLE>我喜爱的地方</TITLE>
<SCRIPT LANGUAGE=VBScript>
<!--
sub likeit()
    for i=0 to Document.forms(0).place.length-1
If Document.forms(0).place(i).checked then
Document.forms(0).favor.value=Document.forms(0).place(i).value
       End If
    next
End sub
-->
</SCRIPT></HEAD><BODY>
<FORM>
<INPUT TYPE="text" Name="favor"><BR>
请选择你喜欢的旅游地点:<br>
<INPUT TYPE="radio" Name="place"
VALUE="新加坡" OnClick="likeit()">新加坡<BR>
<INPUT TYPE="radio" Name="place"
VALUE="泰国" OnClick="likeit()">泰国<BR>
<INPUT TYPE="radio" Name="place"
VALUE="马来西亚" OnClick="likeit()">马来西亚<BR>
<INPUT TYPE="radio" Name="place"
VALUE="欧洲" OnClick="likeit()">欧洲<BR>
</FORM></BODY></HTML>
      例3-53 在单击单选框时将选择的旅游地点写入文本框中
(3)OnFocus
当单选框获得焦点时,触发OnFocus事件。
(4)OnMouseDown
当鼠标单击单选框,在按下鼠标时,触发OnMouseDown事件。
(5)OnMouseUp
当鼠标单击单选框,在松开鼠标时,触发OnMouseUp事件。
5.复选框的属性、方法和事件
复选框的属性、方法和事件如表3-21所示。虽然从HTML的角度来看,复选框和单选框是完全不同的两种标签,一组复选框之间可能互不影响,每个都是独立的设置。并且,复框和单选框使用场合也有很大的区别,使用复选框时并不要求象单选框一样作出非此即彼的选择,对于每一个复选框来说,都相互独立地具有选中和不选中两种状态,但是,从VBScript的角度来看,复选框的属性、方法和事件和单选框十分相似,只是复选框的type属性值为checkbox。关于复选框的其他属性、方法和事件,请参见单选框的相关介绍。
                    表3-21 复选框的属性、方法和事件
属性 方法 事件
Checked blur() OnBlur
Defaultehecked click() OnChange
Form focus() OnCIick
Name HandleEvent() OnfOcus
Type   onMouseDown
Value   OnMouseUp
例3-54是一个关于网上购买的例子,有Mouse、Keyboard、Modern三种商品,用户可以购买其中一种或者几种商品,在表单提交时,VBScript的处理函数可以计算总价格并且告诉用户。
<HTML><HEAD><TITLE>Computer Shop</TITLE>
<SCRIPT LANGUAGE=VBScript>
<!--
function price()
   DIM money
   money=0
   If (Document.forms(0).mouse.checked) then
       money=money+50
   End If
   If (Document.forms(0).keyboard.checked) then
       money=money+100
   End If
   If (Document.forms(0).modem.checked) then
       money=money+500
   End If
   alert("价格是:" & money & "元")
End function
-->
</SCRIPT></HEAD>
<BODY>
<FORM METHOD=POST OnSubmit="price()">
<INPUT TYPE="checkbox" Name="mouse" VALUE="mouse">
鼠标(50元)<BR>
<INPUT TYPE="checkbox" Name="keyboard" VALUE="keyboard">
键盘(100元)<BR>
<INPUT TYPE="checkbox" Name="modem" VALUE="modem">
Modem(500元)<BR>
<INPUT TYPE="submit">
</FORM></BODY></HTML>
       例3-54 网上购买时使用复选框的例子

Select选择列表对象
选择列表对象在HTML页面中也是经常使用到的一种表单元素,它能够在一个比较小的空间内给出一定的信息,如果需要在十几个甚至几十个选项中选中一项(可以使用单选框)或者几项(可以使用复选框),我们往往都需要用到选择列表对象,可以想象,如果使用单选框或者复选框,页面结构将会变得多么糟糕,但我们可以使用选择列表,会使得页面结构得到很大改善。
1.选择列表的属性、方法和事件
选择列表的属性、方法和事件如表3-22所示,有关它们的详细情况我们下面展开。
           表3-22 选择列襄的属性、方法和事件
属性 方法 事件
Form blur() OnBlur
Length focus() OnChange
Name HandleEvent() OnFoeus
Options 
SelectedIndex 
Type 
2.属性
(1)form
form属性反映了包含选择列表的表单。
(2)length
leugth属性说明了选择列表中选项的长度。
(3)name
name属性值即为选择列表的名称。
(4)options
options属性是选择列表的选项的数组,可以通过options(index)访问选择列表选项数组中的每一个数组元素。例如,如果有一个名称为MySelect的选择列表,则可以通过MySelect.options(0)来访问第1个选项,MySelect.options(1)来访问第2个选项,以此类推。
以下列出options属性的一些用法:
A.options.length。获取选择列表中选项的长度,MySelect.options.length和MySelect.length是相同的。
B.options(index).defaultSelected。反映选择列表中某个选项是否缺省被选中。
C.options(index).index。反映选择列表中某个选项的索引值。
D.options(index).selected。反映选择列表某个选项是否被选中
E.options(index).text反映选择列表中某个选项的文本,即该选项出现在选择列表中的文本。
F.options(index).value。反映选择列表中某个选项的相关描述信息,这些信息在<OPTION>标签的VALUE属性中定义。
(5)selectedIndex
selectedIndex属性是被选中选项的索引值。
例3-55是一个通过selectedlndex直接访问被选中选项的例子,用户在下拉列表中选中喜欢的旅游地点,然后,在提交表单数据时会出现对话框,提示用户选中了哪个旅游地点。
<HTML><HEAD><TITLE>我喜爱的旅游地点</TITLE>
<SCRIPT LANGUAGE=VBScript>
<!--
sub choose()
   alert(Document.forms(0).place.options _
(Document.forms(0).place.selectedIndex).text)
End sub
-->
</SCRIPT></HEAD><BODY>
<FORM METHOD=POST OnSubmit="choose()">
<SELECT Name="place" >
<OPTION SELECTED>新加坡
<OPTION>泰国
<OPTION>马来西亚
<OPTION>欧洲
</SELECT>
<INPUT TYPE="submit">
</FORM></BODY></HTML>
   例3-55 单击下拉列表时提示用户选择的选择旅游的地方
3.方法
共有两种,其中blur()方法用于释放选择列表的焦点,focus()方法则可以使选择列表获得焦点。
4.事件
(1)OnBlur
当选择列表失去焦点时,触发OnBlur事件。
(2)OnChange
当用户在选择列表中作出新的选择时,触发OnChange事件。如果在OnChange事件中完成某些处理工作,会使得整个页面具有更好的交互性。
例如,在下例中,可以在选择列表的OnChange事件中提示用户选择的音乐类型,改进选择列表的标签即可,如下所示:
<SELECT Name="place" OnChange="choose()">
(3)OnFocus
当选择列表获得焦点时,触发OnFocus事件。

Button按钮对象
1.按钮对象的属性、方法和事件
按钮对象的属性、方法和事件如表3-19所示,随后我们将讲解它们的详细内容。
表3-19 按钮对象的属性、方法和事件
属性 方法 事件
form btur() OnBlur
name click() OnClick
type focus() OnFocus
value handleEvent() OnMouseDown
   OnMOuscUp
2.属性
(1)form
form属性反映了包含该按钮的表单。
(2)name
name属性即为按钮的名称。
(3)type
按钮的type属性值为button。
(4)value
value属性就是显示在按钮上的文本。可以通过修改按钮的value属性值给HTML页面带来动感,并且在不同的状态下可以给予用户不同的提示信息。
例如,我们可以设计一个按钮,在单击后在On和Off状态之间不断地翻转。
下面是使得按钮状态翻转的函数;
<HTML><HEAD>
<SCRIPT LANGUAGE=VBScript>
<!--
function Reverse()
   If Document.forms(0).onoff.value="On" then
       Document.forms(0).onoff.value="Off"
   else
       Document.forms(0).onoff.value="On"
   End If
End function
-->
</SCRIPT></HEAD><BODY>
<FORM action="" method=POST name=form1>
<INPUT TYPE="button" Name="OnOff" VALUE="On" OnClick="Reverse()">
</FORM></BODY></HTML>
例3-51 onoff按钮的Value属性示例
3.方法
blur()方法可以释放按钮的焦点;按钮的click()方法可以模仿按钮的单击动作,但并不触发按钮的OnClick事件处理函数;而focus()方法则可使按钮获得焦点。
4.事件
(1)OnBlur
当按钮失去焦点时,触发OnBlur事件。
(2)OnClick
当鼠标单击按钮时,触发OnClick事件,OnClick事件是OnMouseDown事件和OoMouseUp事件的结合,鼠标单击按钮时,先触发OnMouseDown事件,然后触发OnMouseUp事件,最后触发OnClick事件。一般处理鼠标单击按钮时,使用OnChick事件处理函数。在进行客户端数据验证时,需要用Button按钮的OnChick事件。
例如,单击按钮时出现hello对话框:
<INPUT TYPE="button" OnClick="alert('hello')">
(3)OnFocus
当按钮获得焦点时,触发OnFocus事件。
(4)OnMouseDown
当鼠标单击按钮时,在按下鼠标时,触发OnMouseDown事件。
(5)OnMouseUp
当鼠标单击按钮时,在松开鼠标时,触发OnMouseUp事件。

Reset按钮对象
Reset按钮对象也是一种比较特殊的按钮,和一般的按钮比起来,Reset按钮对象的type属性是reset,而不是button,单击Reset按钮后会将表单中所有元素恢复为缺省值。

Submit按钮对象
Submit按钮对象是一种比较特殊的按钮,和一般的按钮比起来,Submit按钮对象的type属性是submit,而不是button,单击Submit按钮后会将表单数据向服务器器程序发送。不过,一般进行数据有效性验证时,使用Button按钮,而不使用Submit 按钮。

hidden隐藏对象
隐藏对象是一个比较特殊的对象,它并不在表单中显示出来。除了隐藏对象的type属性值为hidden之外,隐藏对象和文本框对象在属性上是一致的,但隐藏对象没有方法可以调用,也没有事件产生。所以,一般不对隐藏对象进行编程控制,隐藏对象大多用于在表单数据提交时传递数据。例如,可以将文本框的输入数据进行转换后存放在隐藏对象中,然后程序通过访问隐藏对象就可以直接获取转换后的数据。

数据有效性验证实例
下面是一个注册页面,在页面中需要输入注册者姓名、密码、确认密码、性别、年龄和Email地址,以及注册者是否对计算机感兴趣等信息。在使用表单进行注册时,有下面的的问题:
(1)如果注册者没有输入姓名,就将表单数据提交到服务器,那么这些表单数据是没有什么意义的。
(2)如果注册者在年龄的文本框中输入非数字字符,或者输入年龄为1000或-30,这样的年龄数据显然也是没有什么意义的。
(3)如果注册者由于疏忽,在密码的文本框和确认密码的文本框中输入不一致,那么在服务器上运行的处理程序将会无所适从。
(4)如果注册者的输入的Email地址不符合Email地址的规定,按照Email地址的规则,必须有@字母在Email地址中出现,如果输入的地址中没有@字母,显然这是一个错误的 Email地址。
作为处理表单提交数据的ASP等程序,应该能够对上述问题进行处理,发现提交数据中的错误,然后给出反馈信息给注册者。但这并不是一个理想的解决方案。
一方面,注册者也许由于一时的疏忽,输入了不合法的数据,作为注册者而言,当然希望能够立即发现疏忽之处,进行改正后能够注册成功,而不是等待服务端处理程序处理后才能得到反馈信息。                        图3-13 HTML表单示例
而另一方面,服务端程序也许需要处理许多注册者由于疏忽或者恶意输入的不合法数据,这会加重服务器的负载。并且,从网络带宽的角度来说,这也不是一个理想的解决方案。所以,我们希望能够在表单数据提交之前就能够进行必要的数据有效性验证:确保注册者输入了姓名、注册者输入的年龄必须是大于10岁小于150岁的整数、注册者输入的密码必须和确认密码一致、注册者输入的Email地址必须含有@字母。
在提交数据前进行数据有效性验证是必要的,这样可以防止将没有意义的数据(用户的玩笑)或者不完整的数据(用户的疏忽)提交给ASP程序处理,从而可以有效地减轻服务器的负担,也可以使用户及时发现输入有误的数据,而不必等到ASP程序处理后才能发现。
在数据有效性验证时,由于只有文本框的输入具有较大的随意性,因而主要是对于文本框的输入进行校验,其他表单元素,如单选框和复选框,用户只能从几个选项中进行选择,不会出现非法的输入,因而不需要完成太多的数据有效性验证工作。
<HTML><HEAD><TITLE> A Form Example</TITLE>
<SCRIPT LANGUAGE="VBScript">
<!--
sub judge()
    If (Document.form1.name.value="") then
        alert("请输入你的姓名")
        Document.form1.name.focus()
        exit sub
    End If
    DIM c
    c=Document.form1.age.value
    If not IsNumeric(c) then
        alert("年龄应该是一个整数")
        Document.form1.age.focus()
        Document.form1.age.select()
        exit sub
    End If
    DIM ageValue
    ageValue=CInt(Document.form1.age.value)
   If (ageValue<10) then
        alert("你输入的年龄太小,请重新输入")
        Document.form1.age.focus()
        Document.form1.age.select()
        exit sub
   End If
   If (ageValue>150) then
        alert("你输入的年龄太大")
        Document.form1.age.focus()
        Document.form1.age.select()
        exit sub
   End If
   If (Document.form1.pwd.value<>Document.form1.confirm.value) then
       alert ("输入的口令不同,请重新输入")
       Document.form1.pwd.focus()
       Document.form1.pwd.select()
       exit sub
   End If
   DIM pos
   pos=instr(Document.form1.email.value,"@")
   If (pos=0) then
      alert("请输入正确的Email地址")
      Document.form1.email.focus()
      Document.form1.email.select()
      exit sub
   End If
   Document.form1.submit
End sub
-->
</SCRIPT></HEAD><BODY>
<CENTER><FONT color=blue>
欢迎你来到我们的网站<BR>
请认真填写以下内容进行<FONT color=red>注册</FONT>
<BR></FONT>
<FORM METHOD=post name=form1
ACTION="http://127.0.0.1/myWeb/test.asp" >
<TABLE><TR><TD>请输入你的姓名</TD>
<TD><INPUT Name="name" ></TD>
</TR><TR><TD>请输入你的口令</TD>
<TD><INPUT TYPE="password" Name="pwd"></TD>
</TR><TR><TD>确认口令</TD>
<TD><INPUT TYPE="password" Name="confirm"></TD>
</TR><TR><TD>性别</TD>
<TD><INPUT TYPE="radio" Name="gender"
VALUE="male" CHECKED>美男
<INPUT TYPE="radio" Name="gender"
VALUE="female" >俊女</TD>
</TR><TR><TD>年龄</TD>
<TD><INPUT Name="age" ></TD>
</TR><TR><TD>Email地址</TD>
<TD><INPUT Name="email" ></TD>
</TR><TR><TD COLSPAN=2><INPUT TYPE="checkbox"
Name="favour">爱好计算机?</TD>
</TR><TR><TD><INPUT TYPE="reset" value=重置></TD>
<TD><INPUT TYPE="Button" OnClick="judge" value=提交查询内容></TD>
</TR></TABLE></FORM></CENTER></BODY></HTML>
    例3-57 一个完整的用VBScript编写的数据有效性验证的例子

ActiveX控件
ActiveX是一套与与语言无关的内部操作技术。它使得采用不同语言编写的软件组件能够在网络环境中一起工作。ActiveX的核心技术是COM和DCOM。ActiveX控件是采用COM创建的可重用的小对象。使用ActiveX控件的目的是进行可视化编程,ActiveX控件采用运行中的DLL的方式来实现,通常有一个.ocx扩展名。
在HTML中使用ActiveX控件,要用<OBJECT>标签,一般还要使用<PARAM>标签来设置ActiveX控件的属性。
使用ActiveX控件要求比较高,如自注册、属性表显示、事件生成等。以下举一例说明(在练习时可能找不到本例中的控件,可参照本例找其它相关控件练习):
<HTML><HEAD><TITLE>ActiveX Object</TITLE>
<OBJECT classid="clsid:D45FD31B-5C6E-11D1-9EC1-00C04FD7081F"
codeBase=http://yourserver/msagent.exe#VERSION=2,0,0,0 id=Agent>
<PARAM NAME="_cx" VALUE="847">
<PARAM NAME="_cy" VALUE="847">
</OBJECT>
<script language=vbscript>
dim Merlin
dim state
state=true
Agent.Connected = true
Agent.Characters.Load "Merlin","c:\\Winnt\\msagent\\chars\\merlin.acs"
set Merlin = Agent.Characters.Character("Merlin")
function showing()
   Window.focus()
   if Merlin.visible=false then
      Merlin.Show()
   end if
   Merlin.Speak wizard.says.value
end function
</script></HEAD>
<BODY bgColor=#ffffff οnlοad="showing" leftmargin="0" topmargin="0">
<form name="wizard">
<input type="hidden" name="says" value="您好!我是您的助手Merlin,你现在进入的是B2B电子商务实验系统。">
</form></BODY></HTML>

JavaScript:Form对象相关推荐

  1. HTML DOM教程 22-HTML DOM Form 对象

    HTML DOM教程 22-HTML DOM Form 对象 1:Form 对象 Form 对象代表一个 HTML 表单. 在 HTML 文档中 <form> 每出现一次,Form 对象就 ...

  2. JavaScript 获得对象的N种方法 [转]

    JavaScript 获得对象的N种方法 [转] 方法如下: document.getElementById(ID)        //获得指定ID值的对象 document.getElementsB ...

  3. JavaScript 复制对象与Object.assign方法无法实现深复制

    在JavaScript这门语言中,数据类型分为两大类:基本数据类型和复杂数据类型.基本数据类型包括Number.Boolean.String.Null.String.Symbol(ES6 新增),而复 ...

  4. javascript 遍历对象

    javascript 遍历对象 <!DOCTYPE html> <html lang="en"><head><meta charset=& ...

  5. javascript定义对象写法(个人整理)

    javascript定义对象的几种简单方法 1.构造函数方式,全部属性及对象的方法都放在构造方法里面定义 优点:动态的传递参数 缺点:每创建一个对象就会创建相同的方法函数对象,占用大量内存 funct ...

  6. javascript笔记:深入分析javascript里对象的创建(上)续篇

    今天回来一看我的博客居然有这么多人推荐真是开心极了,看来大家对我的研究有了认可,写博客的动力越来越大了,而且我发现写javascript在博客园里比较受欢迎,写java的受众似乎少多了,可能博客园里j ...

  7. django form 对象is_bound属性

    问题: 如果判断一个form实例中有没有数据? bug方法: 通过form实例的is_valid()方法来验证 1.Form类的定义 class YourName(Form):your_name = ...

  8. JavaScript Date 对象

    JavaScript Date 对象 JavaScript Date 对象 http://www.w3school.com.cn/jsref/jsref_obj_date.asp 日期处理 Date ...

  9. JavaScript Object对象

    原文:JavaScript Object对象 Object对象 1. 介绍 Object对象,是所有JavaScript对象的超类(基类).Object.prototype(Obecjt的原型)定义了 ...

最新文章

  1. java中使用es精准查询_使用ES简单查询语句须知
  2. python异常值处理箱型图_如何利用python处理异常值?
  3. linux php pdo server,linux服务器用PHP的PDO链接myql方法(php pdo)
  4. 挖掘IP价值 天猫星选让明星直播1+1>2
  5. python global 变量_python global全局变量 模块通信问题
  6. Android7.1取消wifi图标叉号
  7. 矩阵分析 (三) 矩阵的标准形
  8. 深度解析 steam密码js逆向(篇幅很长)
  9. vue倒计时插件(vue-flip-down)
  10. 字节游戏测试开发面试题
  11. 易飞计件工资的设计及应用
  12. linux文件授权用户创建
  13. STEP2——《数据分析:企业的贤内助》重点摘要笔记(五)——数据加工
  14. 骗术一览,大猫小猫都小心了!【转载】
  15. 安卓开发——拍照、裁剪并保存为头像报错:裁剪图片无法保存的
  16. 创业企业如何定制商业模式:把握不同行业生命周期,9大要素集中进行创新【转】...
  17. Mysql的日志详解(详细)
  18. 数字图像处理(DIP)实验4 目标颜色识别
  19. 想看的公众号文章被删了怎么办?
  20. PAOGD个人作业4——利用OpenGL设计贪吃蛇游戏

热门文章

  1. 《CondLaneNet:a Top-to-down Lane Detection Framework Based on Conditional Convolution》论文笔记
  2. android SD卡目录下创建、复制文件夹以及文件
  3. 遍历Arraylist的三种方法及优缺点简单介绍
  4. 【双系统】如何安装ubuntu22.04系统
  5. Leetcode-把数字翻译成字符串
  6. 研究生基本的学习规划
  7. 使用cli安装uni-app后uni-ui的引入
  8. jsp282某小区物业管理系统
  9. 解决QQ连接超时问题
  10. 2019年北京画室排名前十位(设计类/综合类/造型类)