<HTML><!-- #BeginTemplate "/Templates/product.dwt" -->
<HEAD>
<!-- #BeginEditable "doctitle" -->
<TITLE>太平洋软件资讯</TITLE>
<!-- #EndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=">
<link rel="stylesheet" href="text.css">
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<table width="560" align="center" cellspacing="0" cellpadding="0">
<tr>
<td>
<script>document.write("<a href=http://best.netease.com/cgi-bin/view/viewbasic.cgi?exp target=_blank><img src=http://best.netease.com/cgi-bin/log.cgi?user=exp&refer="+escape(document.referrer)+"&cur="+escape(document.URL)+" border=0 alt='网易中文排行榜' width=1 height=1></a>");</script>
<script language="">document.write("<a href=http://best.netease.com/cgi-bin/view/viewbasic.cgi?pconline1 target=_blank><img src=http://best.netease.com/cgi-bin/log.cgi?user=pconline1&refer="+escape(document.referrer)+"&cur="+escape(document.URL)+" border=0 width=1 height=1 ></a>");</script>
</td>
</tr>
<tr>
<td><!-- #BeginEditable "editable" -->
<table border="0" width="580">
<tr>
<td width="10"> </td>
<td>
<p align="CENTER"><font size="6" lang="ZH-CN"><font color="#FF3333" class="title"><b><font size="3" class="coffee"><br>
第八讲 WEB页面信息的交互</font></b></font></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 要实现动态交互,必须掌握有关窗体对象(Form)和框架对象(Frames)更为复杂的知识。</font></p>
<p><b><font face="宋体" lang="ZH-CN" size="5">一、窗体基础知识</font></b></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 窗体对象可以使设计人员能用窗体中不同的元素与客户机用户相交互,而用不着在之前首先进行数据输入,就可以实现动态改变Web文档的行为。</font></p>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN">1、什么是窗体对象</font></b></p>
<dir>
<dir>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">窗体(Form):它构成了Web页面的基本元素。通常一个Web页面有一个窗体或几个窗体,使用Forms[]数组来实现不同窗体的访问。</font></p>
</dir>
</dir>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"><form Name=Form1></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"><INPUT type=text...></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"><Input type=text...></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"><Inpup byne=text...></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"></form></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"><form Name=Form2></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"><INPUT type=text...></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"><Input type=text...></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"></form></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 在Forms[0]中共有三个基本元素,而Forms[1]中只有两个元素。</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 窗体对象最主要的功能就是能够直接访问HTML文档中的窗体,它封装了相关的HTML代码:</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"><Form</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">Name ="表的名称"</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">Target ="指定信息的提交窗口"</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">action ="接收窗体程序对应的URL"</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">Method =信息数据传送方式(get/post)</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">enctype ="窗体编码方式"</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">[onsubmit ="JavaScript代码"]></font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"></Form></font></p>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN"> </font></b></p>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN">2、窗体对象的方法</font></b></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 窗体对象的方法只有一个--submit()方法,该方法主要功用就是实现窗体信息的提交。如提交Mytest窗体,则使用下列格式:</font></p>
<dir>
<dir>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">document.mytest.submit()</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> </font></p>
</dir>
</dir>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN">3、窗体对象的属性</font></b></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 窗体对象中的属性主要包括以下:elements
name action target encoding method.</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 除Elements外,其它几个均反映了窗体中标识中相应属性的状态,这通常是单个窗体标识;而elements常常是多个窗体元素值的数组,例:
</font></p>
<dir>
<dir>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">elements[0].Mytable.elements[1]</font></p>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN"> </font></b></p>
</dir>
</dir>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN">4、访问窗体对象</font></b></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">在JavaScript中访问窗体对象可由两种方法实现:</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">(1)通过访问窗体</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 在窗体对象的属性中首先必须指定其窗体名,而后就可以通过下列标识访问窗体如:document.Mytable()。</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">(2)通过数组来访问窗体</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 除了使用窗体名来访问窗体外,还可以使用窗体对象数组来访问窗体对象。但需要注意一点,因窗体对象是由浏览器环境的提供的,而浏览器环境所提供的数组下标是由0到n。所以可通过下列格式实现窗体对象的访问:</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">document.forms[0]</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">document.forms[1]</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">document.forms[2]...</font></p>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN"> </font></b></p>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN">5、引用窗体的先决条件</font></b></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> 在JavaScript中要对窗体引用的条件是:必须先在页面中用标识创建窗体,并将定义窗体部分放在引用之前。</font></p>
<p align="JUSTIFY"><b><font face="宋体" lang="ZH-CN"> </font></b></p>
<p><b><font face="宋体" lang="ZH-CN" size="5">二、窗体中的基本元素</font></b></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">窗体中的基本元素由按钮、单选按钮、复选按钮、提交按钮、重置按钮、文本框等组成。<br>
在JavaScript中要访问这些基本元素,必须通过对应特定的窗体元素的数组下标或窗体元素名来实现。每一个元素主要是通过该元素的属性或方法来引用。其引用的基本格式见下:</font></p>
<dir>
<dir>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">formName.elements[].methadName
(窗体名.元素名或数组.方法)</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN">formName.elemaent[].propertyName(窗体名.元素名或数组.属性)</font></p>
<p align="JUSTIFY"><font face="宋体" lang="ZH-CN"> </font></p>
</dir>