无刷新联动下拉菜单(DotTextWeb版)

无刷新联动菜单相信大家都听说或者掌握了，但是我一直没有解决的问题就是怎样获得被联动的下拉菜单的值。前几天下载了DotTextWeb，在Register.aspx里面突然发现了有这个东西，兴奋不已，于是就去看代码了，发现它用的是js，相信大家都看多XmlHTTPRequest实现的，我技术水平只能达到抄的水平，于是就没有深入的研究，这次让我看到了如此之好的代码，我就不能放过了，呵呵，
以下代码需要了解js的基本和DOM的基础就可以了。
首先和DotTextWeb一样，建立一个.ascx文件，里面的主要是放入两个联动的下拉列表
代码如下:

<select name="shen" onChange="redirectff(this.options.selectedIndex)">
2

<option value="直辖市" selected>直辖市</option>
3

<option value="湖北">湖北</option>
4

<option value="河北">河北</option>
5

<option value="山西">山西</option>
6

<option value="内蒙古">内蒙古</option>
7

<option value="辽宁">辽宁</option>
8

<option value="吉林">吉林</option>
9

<option value="黑龙江">黑龙江</option>
10

<option value="江苏">江苏</option>
11

<option value="浙江">浙江</option>
12

<option value="安徽">安徽</option>
13

<option value="福建">福建</option>
14

<option value="江西">江西</option>
15

<option value="山东">山东</option>
16

<option value="河南">河南</option>
17

<option value="海南">海南</option>
18

<option value="广东">广东</option>
19

<option value="广西">广西</option>
20

<option value="湖南">湖南</option>
21

<option value="四川">四川</option>
22

<option value="贵州">贵州</option>
23

<option value="云南">云南</option>
24

<option value="西藏">西藏</option>
25

<option value="陕西">陕西</option>
26

<option value="甘肃">甘肃</option>
27

<option value="宁夏">宁夏</option>
28

<option value="青海">青海</option>
29

<option value="新疆">新疆</option>
30

</select>
31

省
32

<select name="city">
33

<option value="北京">北京</option>
34

<option value="上海">上海</option>
35

<option value="天津">天津</option>
36

<option value="重庆">重庆</option>
37

</select>
38

市 <font color="red">*</font>
39

<!--
41

var groups=document.frmRegister.shen.options.length;
42

var group=new Array(groups);
43

for (i=0; i<groups; i++)
44

group[i]=new Array();
45

group[0][0]=new Option("北京","北京");
47

group[0][1]=new Option("上海","上海");
48

group[0][2]=new Option("天津","天津");
49

group[0][3]=new Option("重庆","重庆");
50

group[1][0]=new Option("武汉","武汉");
51

group[1][1]=new Option("鄂州","鄂州");
52

group[1][2]=new Option("孝感","孝感");
53

group[1][3]=new Option("黄冈","黄冈");
54

group[1][4]=new Option("黄石","黄石");
55

group[1][5]=new Option("咸宁","咸宁");
56

group[1][6]=new Option("沙市","沙市");
57

group[1][7]=new Option("宜昌","宜昌");
58

group[1][8]=new Option("恩施","恩施");
59

group[1][9]=new Option("十堰","十堰");
60

group[1][10]=new Option("襄樊","襄樊");
61

group[1][11]=new Option("荆门","荆门");
62

group[2][0]=new Option("石家庄","石家庄");
63

group[2][1]=new Option("保定","保定");
64

group[2][2]=new Option("张家口","张家口");
65

group[2][3]=new Option("承德","承德");
66

group[2][4]=new Option("唐山","唐山");
67

group[2][5]=new Option("廊坊","廊坊");
68

group[2][6]=new Option("沧州","沧州");
69

group[2][7]=new Option("衡水","衡水");
70

group[2][8]=new Option("邢台","邢台");
71

group[2][9]=new Option("邯郸","邯郸");
72

group[2][10]=new Option("秦皇岛","秦皇岛");
73

group[3][0]=new Option("太原","太原");
74

group[3][1]=new Option("大同","大同");
75

group[3][2]=new Option("阳泉","阳泉");
76

group[3][3]=new Option("榆次","榆次");
77

group[3][4]=new Option("长治","长治");
78

group[3][5]=new Option("晋城","晋城");
79

group[3][6]=new Option("临汾","临汾");
80

group[3][7]=new Option("离石","离石");
81

group[3][8]=new Option("运城","运城");
82

group[3][9]=new Option("忻州","忻州");
83

group[4][0]=new Option("呼和浩特","呼和浩特");
84

group[4][1]=new Option("包头","包头");
85

group[4][2]=new Option("乌海","乌海");
86

group[4][3]=new Option("集宁","集宁");
87

group[4][4]=new Option("通辽","通辽");
88

group[4][5]=new Option("赤峰","赤峰");
89

group[4][6]=new Option("东胜","东胜");
90

group[4][7]=new Option("锡林浩特","锡林浩特");
91

group[4][8]=new Option("海拉尔","海拉尔");
92

group[5][0]=new Option("沈阳","沈阳");
93

group[5][1]=new Option("大连","大连");
94

group[5][2]=new Option("瓦房店","瓦房店");
95

group[5][3]=new Option("鞍山","鞍山");
96

group[5][4]=new Option("抚顺","抚顺");
97

group[5][5]=new Option("本溪","本溪");
98

group[5][6]=new Option("丹东","丹东");
99

group[5][7]=new Option("锦州","锦州");
100

group[5][8]=new Option("营口","营口");
101

group[5][9]=new Option("阜新","阜新");
102

group[5][10]=new Option("辽阳","辽阳");
103

group[5][11]=new Option("铁岭","铁岭");
104

group[6][0]=new Option("长春","长春");
105

group[6][1]=new Option("吉林","吉林");
106

group[6][2]=new Option("延吉","延吉");
107

group[6][3]=new Option("四平","四平");
108

group[6][4]=new Option("通化","通化");
109

group[6][5]=new Option("白城","白城");
110

group[6][6]=new Option("辽源","辽源");
111

group[6][7]=new Option("前郭","前郭");
112

group[6][8]=new Option("浑江","浑江");
113

group[6][9]=new Option("梅河口","梅河口");
114

group[7][0]=new Option("哈尔滨","哈尔滨");
115

group[7][1]=new Option("齐齐哈尔","齐齐哈尔");
116

group[7][2]=new Option("牡丹江","牡丹江");
117

group[7][3]=new Option("佳木斯","佳木斯");
118

group[7][4]=new Option("绥化","绥化");
119

group[7][5]=new Option("黑河","黑河");
120

group[7][6]=new Option("加格达其","加格达其");
121

group[7][7]=new Option("伊春","伊春");
122

group[7][8]=new Option("大庆","大庆");
123

group[7][9]=new Option("阿城","阿城");
124

group[8][0]=new Option("南京","南京");
125

group[8][1]=new Option("镇江","镇江");
126

group[8][2]=new Option("南通","南通");
127

group[8][3]=new Option("苏州","苏州");
128

group[8][4]=new Option("扬州","扬州");
129

group[8][5]=new Option("盐城","盐城");
130

group[8][6]=new Option("徐州","徐州");
131

group[8][7]=new Option("淮阴","淮阴");
132

group[8][8]=new Option("连云港","连云港");
133

group[8][9]=new Option("常州","常州");
134

group[8][10]=new Option("无锡","无锡");
135

group[8][11]=new Option("常熟","常熟");
136

group[8][12]=new Option("张家港","张家港");
137

group[9][0]=new Option("杭州","杭州");
138

group[9][1]=new Option("湖州","湖州");
139

group[9][2]=new Option("嘉兴","嘉兴");
140

group[9][3]=new Option("宁波","宁波");
141

group[9][4]=new Option("绍兴","绍兴");
142

group[9][5]=new Option("临海","临海");
143

group[9][6]=new Option("温州","温州");
144

group[9][7]=new Option("丽水","丽水");
145

group[9][8]=new Option("金华","金华");
146

group[9][9]=new Option("衢州","衢州");
147

group[10][0]=new Option("合肥","合肥");
148

group[10][1]=new Option("蚌埠","蚌埠");
149

group[10][2]=new Option("芜湖","芜湖");
150

group[10][3]=new Option("马鞍山","马鞍山");
151

group[10][4]=new Option("安庆","安庆");
152

group[10][5]=new Option("宿县","宿县");
153

group[10][6]=new Option("阜阳","阜阳");
154

group[10][7]=new Option("黄山","黄山");
155

group[10][8]=new Option("滁州","滁州");
156

group[10][9]=new Option("淮北","淮北");
157

group[10][10]=new Option("铜陵","铜陵");
158

group[10][11]=new Option("宣城","宣城");
159

group[10][12]=new Option("六安","六安");
160

group[10][13]=new Option("巢湖","巢湖");
161

group[11][0]=new Option("福州","福州");
162

group[11][1]=new Option("厦门","厦门");
163

group[11][2]=new Option("宁德","宁德");
164

group[11][3]=new Option("莆田","莆田");
165

group[11][4]=new Option("泉州","泉州");
166

group[11][5]=new Option("漳州","漳州");
167

group[11][6]=new Option("龙岩","龙岩");
168

group[11][7]=new Option("三明","三明");
169

group[11][8]=new Option("南平","南平");
170

group[12][0]=new Option("南昌","南昌");
171

group[12][1]=new Option("九江","九江");
172

group[12][2]=new Option("上饶","上饶");
173

group[12][3]=new Option("陵川","陵川");
174

group[12][4]=new Option("宜春","宜春");
175

group[12][5]=new Option("吉安","吉安");
176

group[12][6]=new Option("赣州","赣州");
177

group[12][7]=new Option("景德镇","景德镇");
178

group[12][8]=new Option("萍乡","萍乡");
179

group[12][9]=new Option("分宜","分宜");
180

group[13][0]=new Option("济南","济南");
181

group[13][1]=new Option("青岛","青岛");
182

group[13][2]=new Option("淄博","淄博");
183

group[13][3]=new Option("德州","德州");
184

group[13][4]=new Option("烟台","烟台");
185

group[13][5]=new Option("潍坊","潍坊");
186

group[13][6]=new Option("济宁","济宁");
187

group[13][7]=new Option("泰安","泰安");
188

group[13][8]=new Option("荷泽","荷泽");
189

group[13][9]=new Option("威海","威海");
190

group[13][10]=new Option("日照","日照");
191

group[13][11]=new Option("临沂","临沂");
192

group[13][12]=new Option("聊城","聊城");
193

group[14][0]=new Option("郑州","郑州");
194

group[14][1]=new Option("安阳","安阳");
195

group[14][2]=new Option("新乡","新乡");
196

group[14][3]=new Option("许昌","许昌");
197

group[14][4]=new Option("平顶山","平顶山");
198

group[14][5]=new Option("信阳","信阳");
199

group[14][6]=new Option("南阳","南阳");
200

group[14][7]=new Option("开封","开封");
201

group[14][8]=new Option("洛阳","洛阳");
202

group[14][9]=new Option("商丘","商丘");
203

group[14][10]=new Option("焦作","焦作");
204

group[14][11]=new Option("鹤壁","鹤壁");
205

group[14][12]=new Option("濮阳","濮阳");
206

group[14][13]=new Option("周口","周口");
207

group[14][14]=new Option("漯河","漯河");
208

group[14][15]=new Option("驻马店","驻马店");
209

group[14][16]=new Option("三门峡","三门峡");
210

group[15][0]=new Option("海口","海口");
211

group[15][1]=new Option("三亚","三亚");
212

group[15][2]=new Option("儋县","儋县");
213

group[16][0]=new Option("河源","河源");
214

group[16][1]=new Option("中山","中山");
215

group[16][2]=new Option("顺德","顺德");
216

group[16][3]=new Option("东莞","东莞");
217

group[16][4]=new Option("江门","江门");
218

group[16][5]=new Option("湛江","湛江");
219

group[16][6]=new Option("肇庆","肇庆");
220

group[16][7]=new Option("佛山","佛山");
221

group[16][8]=new Option("珠海","珠海");
222

group[16][9]=new Option("深圳","深圳");
223

group[16][10]=new Option("汕头","汕头");
224

group[16][11]=new Option("梅州","梅州");
225

group[16][12]=new Option("广州","广州");
226

group[16][13]=new Option("韶关","韶关");
227

group[16][14]=new Option("惠州","惠州");
228

group[16][15]=new Option("英德","英德");
229

group[16][16]=new Option("潮州","潮州");
230

group[16][17]=new Option("惠来","惠来");
231

group[16][18]=new Option("茂名","茂名");
232

group[17][0]=new Option("南宁","南宁");
233

group[17][1]=new Option("柳州","柳州");
234

group[17][2]=new Option("桂林","桂林");
235

group[17][3]=new Option("梧州","梧州");
236

group[17][4]=new Option("玉林","玉林");
237

group[17][5]=new Option("钦州","钦州");
238

group[17][6]=new Option("河池","河池");
239

group[17][7]=new Option("北海","北海");
240

group[17][8]=new Option("防城","防城");
241

group[18][0]=new Option("长沙","长沙");
242

group[18][1]=new Option("湘潭","湘潭");
243

group[18][2]=new Option("株州","株州");
244

group[18][3]=new Option("衡阳","衡阳");
245

group[18][4]=new Option("郴州","郴州");
246

group[18][5]=new Option("常德","常德");
247

group[18][6]=new Option("益阳","益阳");
248

group[18][7]=new Option("娄底","娄底");
249

group[18][8]=new Option("邵阳","邵阳");
250

group[18][9]=new Option("岳阳","岳阳");
251

group[18][10]=new Option("怀化","怀化");
252

group[19][0]=new Option("成都","成都");
253

group[19][1]=new Option("攀枝花","攀枝花");
254

group[19][2]=new Option("自贡","自贡");
255

group[19][3]=new Option("永川","永川");
256

group[19][4]=new Option("温江","温江");
257

group[19][5]=new Option("绵阳","绵阳");
258

group[19][6]=new Option("南充","南充");
259

group[19][7]=new Option("达县","达县");
260

group[19][8]=new Option("万县市","万县市");
261

group[19][9]=new Option("涪陵","涪陵");
262

group[19][10]=new Option("沪州","沪州");
263

group[19][11]=new Option("宜宾","宜宾");
264

group[19][12]=new Option("内江","内江");
265

group[19][13]=new Option("乐山","乐山");
266

group[19][14]=new Option("西昌","西昌");
267

group[19][15]=new Option("雅安","雅安");
268

group[19][16]=new Option("马尔康","马尔康");
269

group[19][17]=new Option("德阳","德阳");
270

group[19][18]=new Option("广元","广元");
271

group[20][0]=new Option("贵阳","贵阳");
272

group[20][1]=new Option("遵义","遵义");
273

group[20][2]=new Option("安顺","安顺");
274

group[20][3]=new Option("都匀","都匀");
275

group[20][4]=new Option("凯里","凯里");
276

group[20][5]=new Option("铜仁","铜仁");
277

group[20][6]=new Option("毕节","毕节");
278

group[20][7]=new Option("六盘水","六盘水");
279

group[20][8]=new Option("兴义","兴义");
280

group[21][0]=new Option("昆明","昆明");
281

group[21][1]=new Option("大理","大理");
282

group[21][2]=new Option("个旧","个旧");
283

group[21][3]=new Option("曲靖","曲靖");
284

group[21][4]=new Option("保山","保山");
285

group[21][5]=new Option("文山","文山");
286

group[21][6]=new Option("玉溪","玉溪");
287

group[21][7]=new Option("楚雄","楚雄");
288

group[21][8]=new Option("思茅","思茅");
289

group[21][9]=new Option("昭通","昭通");
290

group[22][0]=new Option("拉萨","拉萨");
291

group[23][0]=new Option("西安","西安");
292

group[23][1]=new Option("延安","延安");
293

group[23][2]=new Option("榆林","榆林");
294

group[23][3]=new Option("商州","商州");
295

group[23][4]=new Option("安康","安康");
296

group[23][5]=new Option("汉中","汉中");
297

group[23][6]=new Option("宝鸡","宝鸡");
298

group[23][7]=new Option("铜川","铜川");
299

group[23][8]=new Option("咸阳","咸阳");
300

group[23][9]=new Option("长安","长安");
301

group[24][0]=new Option("兰州","兰州");
302

group[24][1]=new Option("定西","定西");
303

group[24][2]=new Option("平凉","平凉");
304

group[24][3]=new Option("西峰","西峰");
305

group[24][4]=new Option("武威","武威");
306

group[24][5]=new Option("张掖","张掖");
307

group[24][6]=new Option("酒泉","酒泉");
308

group[24][7]=new Option("天水","天水");
309

group[24][8]=new Option("成都","成都");
310

group[24][9]=new Option("林夏","林夏");
311

group[25][0]=new Option("银川","银川");
312

group[25][1]=new Option("石嘴山","石嘴山");
313

group[25][2]=new Option("吴忠","吴忠");
314

group[25][3]=new Option("固原","固原");
315

group[26][0]=new Option("西宁","西宁");
316

group[26][1]=new Option("平安","平安");
317

group[26][2]=new Option("同仁","同仁");
318

group[26][3]=new Option("共和","共和");
319

group[26][4]=new Option("德令哈","德令哈");
320

group[26][5]=new Option("门源","门源");
321

group[26][6]=new Option("格尔木","格尔木");
322

group[27][0]=new Option("乌鲁木齐","乌鲁木齐");
323

group[27][1]=new Option("奎屯","奎屯");
324

group[27][2]=new Option("石河子","石河子");
325

group[27][3]=new Option("昌吉","昌吉");
326

group[27][4]=new Option("吐鲁番","吐鲁番");
327

group[27][5]=new Option("库尔勒","库尔勒");
328

group[27][6]=new Option("阿克苏","阿克苏");
329

group[27][7]=new Option("喀什","喀什");
330

group[27][8]=new Option("伊犁","伊犁");
331

group[27][9]=new Option("克拉玛依","克拉玛依");
332

333

var tempff=document.frmRegister.city;
334

335

function redirectff(x){
336

for (m=tempff.options.length-1;m>0;m--)
337

tempff.options[m]=null;
338

for (i=0;i<group[x].length;i++){
339

tempff.options[i]=new Option(group[x][i].text,group[x][i].value);
340

}
341

tempff.options[0].selected=true;
342

}
343

344

//-->
345

</script>

当name为shen的select改变时发生redirectff时间，name为city，注意这里的city，是第二个select的name属性值，在以后有很到的用途。它就会产生相应的下拉列表。
然后建立一个.aspx文件，把.ascx拖入到其中，暂时放入一个button按钮
现在就让我产生button1.click()事件
为了得到第二个下拉列表(name="city")的值，在button1.click()事件当中插入以下代码

Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
2

Dim s As String = Request.Form.Get("city")
3

Response.Write(s)
4

End Sub

最关键的当然是Request.Form.Get("city")了，输出一下，这样就可以得到city所选的值了
以前总是不知道怎么得到第二个下拉列表的值，现在明白了，利用Request.Form.Get("city")得到客户端的city的值或者Request.Form("city")都可以。

posted @ 2005-09-28 20:14 徐灿钊Asp.net专栏阅读(3287) 评论(6) 收藏举报

SEE YOU SEE ME

LightFrame.nowar

无刷新联动下拉菜单(DotTextWeb版)

公告