基于Javascript技术的关联表单设计和实现

基于Ｊａｖａｓｃｒｉｐｔ技术的关联表单设计和实现

作者：徐杰孟建新

来源：《现代电子技术》2008年第02期

摘要：表单的填选及提交是ASP程序中用户和服务器交换数据的最基本手段。在有些信息系统中，对用户注册的个人信息有着较高的要求，用户提交数据的可靠性、严谨性是决定程序有效运行的主要因素。介绍一种基于Javascript技术的组合表单应用，能够严谨又方便地为用户提供大量数据的选择，确保用户注册信息的正确与严谨。

关键词：关联表单；Javascript；ASP；用户提交数据

中图分类号：TP311 文献标识码：B

文章编号：1004-373X(2008)02-093-

(Basic Department,Bengbu Tank Institute,Bengbu,233000

Abstract：Select form and sumit filling the form and submit elections,the process of ASP users and server data exchange of the most basic means.Some of the information system,the user′s personal information registered higher demand,users of the reliability of data,solemnity,the ASP decided whether the procedures and effective functioning of the main factors.This paper describes a technique based on the combination of Javascript application form,to stringent convenient for users with the

ch

Keywords：

表单的填选及提交是Web应用程序中用户和系统交互的基本方法。在有些信息系统中，对用户注册的个人信息有着较高的要求，用户提交数据的可靠性、严谨性、是决定应用程序有效运行的主要因素。本文介绍了一种ASP技术框架下的基于javascript技术的组合表单应用，能够严谨又方便地为用户提供大量数据的选择，确保了用户注册信息的正确与严谨。表单功能演示地址见文献[1]。

下拉表单的二次选择、相互关联、内容准确方便，在注册或提交数据等操作时能带给用户非常良好的体验。不用刷新页面，就能方便快捷地进行选择关联项目。

本文介绍的关联表单，以注册时的省市和地区选择为例，把第1列的数据选中后，第2列的表单选项随之做相应的变化，全国几十个省市、几百个地区，用这样的方法实现，是非常方便的。

1 建立selectcity.js文件定义数据组和function过程

首先在相同目录内建立文件selectcity.js，并在ASP程序中包调用文件。selectcity.js文件中存放数据，selectcity.js列出部分Array数组数据如下：

ProvinceArray［0］ = "选择省市

ProvinceArray［1］ = "北京

ProvinceArray［2］ = "上海

ProvinceArray［34］ = "台湾

以上是城市选择数组，下面是相应的地区数组，只列出部分记录，其他内容可以仿照格式自行添加。应用十分方便。

tCitys［1］

tCitys［1］［1］ = "北京/东城区

tCitys［1］［2］ = "北京/西城区

tCitys［1］［18］ = "北京/延庆县

tCitys［2］

tCitys［2］［1］ = "上海/黄浦区