



















我个人感觉使用客户端javascript脚本控制,难点是两个菜单中的数据都是数据库中动态绑定上去的,因此如何将菜单中的数据读入到客户点脚本中也是一个问题。可以使用ASP.NET动态生成含有菜单的元素内容的script脚本,这样在客户端进行菜单选择时,全部都是客户端脚本操作,速度很快,从而提高了性能。
以下举一个例子,一级菜单显示的栏目的类别(Catalogs),每个类别下又下设了很多的栏目(Class),因此二级菜单的内容就是根据一级菜单栏目的选择显示出栏目。首先先介绍一下用到的数据表:
|
newscatalogs表 |
newsclass表 | |
|
PK |
catalogid |
classid |
|
catalogname |
classname | |
|
foundname |
catalogid | |
|
addTime |
addtime |
在VS中新建一个webform,页面上放置两个下拉列表框DropDownlist服务器控件,一个ID是ddlcatalogs,一个ID是ddlclasses,然后再放置一个TextBox,ID是classid,注意三个控件都要在<form></form>标记内。每次在ddlcatalogs中选择一个类别,在ddlclasses中会自动生成属于此类别下的所有栏目,选择ddlclasses中的栏目,会在classid中显示出所选择栏目的数据库id。
控件的HTML代码如下:
在页面的Page_Load事件中输入以下代码(代码是用VB.NET写的,读者如使用C#可以理解原理后自己改写):
运行一下,在浏览中选择查看源代码,即可看见程序生成的含有数据的script(模拟数据):
1
<script><!--
2
var group=new Array(5);for (i=0; i<5; i++){group[i] = new Array()}
3
group[0][0]=new Option("学院公共信息","23");
4
group[0][1]=new Option("学院公报","24");
5
group[1][0]=new Option("首页新闻","10");
6
group[1][1]=new Option("首页公告","11");
7
group[2][0]=new Option("营销快讯","12");
8
group[2][1]=new Option("营销系-教学论文","13");
9
group[2][2]=new Option("网络营销快讯","17");
10
group[2][3]=new Option("就业信息","20");
11
group[3][0]=new Option("秘书室新闻","21");
12
group[4][0]=new Option("IT技术","18");
13
group[4][1]=new Option(".net技术","19");
14
15
function redirect(x){
16
for (m=Form1.l1.options.length-1;m>0;m--){Form1.l1.options[m]=null}
17
for (i=0;i<group[x].length;i++){
18
Form1.l1.options[i]=new Option(group[x][i].text,group[x][i].value)}
19
Form1.l1.options[0].selected=true;Form1.classid.value=Form1.l1.options[0].value;}
20
function choose(x){Form1.classid.value=Form1.l1.options[x].value;}
21
--></script>
此内容由惯性聚合(RSS阅读器)自动聚合整理,仅供阅读参考。 原文来自 — 版权归原作者所有。