(江西制造职业技术学院信息工程系，江西 南昌 330000)

摘 要：专门针对Web下拉框控件影响网页性能、不利于美工和维护等问题，通过比较Web下拉框与Html下拉框各自的利弊，提出一种基于XML实现可配置Html下拉框的方法。该方法提高网页性能、方便界面美工、提高维护效率。

关键词：Html控件;XML;JavaScript;可配置

中图分类号：TP 文献标识码：A文章编号：1672-3198(2011)01-0302-01

1 下拉框的潜在问题

1.1Web下拉框控件影响性能

Web下拉框控件最大的优势在于全面，既能满足前台选择的需要，也能满足后台数据库交互的需要。正因为这样，Web下拉框控件受到大部分初学者的青睐。然而，通常情况下，下拉框控件只被用于选项选择，不与后台数据库交互。此时，Web下拉框控件的回发特性无形中给IE浏览器造成负载压力，使之无故刷新，严重时引起假死白屏。

1.2 Web下拉框控件不利于美工

Web下拉框控件是对Html下拉框控件的综合封装，其美工设计都是“傻瓜式”的点对点。易于配置的同时，牺牲了灵活性，众多复杂的特效难以实现，极不利于高级美工调整。

1.3 下拉框控件选项难以保持一致

无论是Web下拉框控件还是Html下拉框控件，其选项必须事先录入。代码表现为：

江西

若该下拉框被同时用于多个Html页面，一旦发生变化，所有被涉及的页面都要统一修改，稍有遗漏便会导致页面间相同下拉框选项不一致，极不利于后期维护。

2 改进总体方案

2.1 改用Html下拉框控件 提高性能和美工灵活性

Web下拉框控件影响性能，主要是因为Web控件具有回发特性，即页面每次刷新都要往返服务器。若不与服务器上的数据库交换数据，这种回发是完全没有必要的。对于常用于选项选择，不与数据库交换数据的下拉框而言，每次回发无疑是一种性能上的耗费。

相比之下，Html下拉框控件是纯粹的客户端控件，即页面每次刷新都不与服务器回发，不与数据库交换数据，非常适合仅做选项选择的下拉框。因为不必做无谓的回发，所以有效提高网站性能。

另一方面，正因为改用了Html下拉框控件，解除了Web控件在美工方面的封装束缚，使得美工师能够直接对其Html代码进行加工，从而灵活实现各种特效。

2.2 使用XML保持下拉框控件选项一致性

为保持选项的一致性，只能把所有选项统一存放于配置文件处，即实现下拉框选项的可配置性。这样，所有下拉框都从该配置文件中获取选项内容，有效避免因选项变化导致下拉框选项不一致的逻辑错误。

其实，配置文件就是一个小型数据库，存取原理与数据库相同。但选用SQL或ORACLE这样大型的数据库做配置文件不利于后期部署。所以，选择适合小型文件的XML技术较为适合。

2.3 基于XML的可配置Html下拉框的总体设计

当页面加载时，Html控件通过JavaScript脚本从XML文件获取并显示选项内容。其中，Html下拉框控件是纯粹的客户端控件，不引起与服务器的回发，提高客户端性能。XML文件作为配置文件，旨在存储下拉框选项内容。JavaScript也是纯粹的客户端技术，旨在绑定Html下拉框控件和XML文件。如图1所示。

3 XML实现配置性的详细方案

3.1 定义XML文件格式

XML文件作为配置文件的载体，首先要定义供数据存取的结构。如定义性别下拉框的选项。首先定义性别选项框，然后定义选项内容，代码如下：

若要添加新的下拉框及其选项内容，只需在后面追加即可，非常利于今后扩展。

3.2 定义JS脚本代码

XML文件中的选项内容若要在下拉框中显示，必须通过JavaScript脚本绑定。其脚本执行流程为：首先通过传参的方式定位XML文件，然后进入加载环节。加载时，先判断是否加载过该XML文件。若已加载，直接进入绑定环节。若未加载，先加载XML文件，再进入绑定环节。绑定时，先判断是否将选项与下拉框绑定过。若已绑定，先清空下拉框选项，再重新绑定。若未绑定，直接进行绑定该流程。

3.3 使用JS脚本绑定下拉框选项

首先把JS脚本拖拽进Html页面，代码如下：

然后在Html页面中创建Html下拉框控件，代码如下：

最后执行JS脚本实现绑定。在后台通过代码Page.ClientScript.RegisterStartupScript(typeof(string),"", @" InitSelect('../Xml/Enum.xml', 'sex', 'Root//Sex');")调用。其中从InitSelect方法的各项参数可知，名为sex的Html下拉框控件将从../Xml/Enum.xml配置文件中获取绑定Root/Sex下的选项内容。

参考文献

［1］(美)泽卡斯著,李松峰等译.JavaScript高级程序设计(第2版)［M］.北京：人民邮电出版社,2010.