• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

asp.net中的联动菜单------使用客户端脚本JavaScript

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

目标达到的效果:两个下拉框,第二个跟随第一个变化而变化,使用客户端脚本
JavaScriptASP.NET环境下实现。

 

第一步:建立JavaScript脚本:

Page_Load中建立并注册这个js脚本:

 

string scriptKey = "MenuChange";

if (!Page.IsStartupScriptRegistered(scriptKey) &&  !Page.IsPostBack)

{

       string scriptBlock = 

              @"<script language=""JavaScript"">

                <!--

                       function InitBigClass()

                       {

                              bigclass  = new Array();

                              bigclass[0]  = new Array();

                              bigclass[0][0]  = '0';

                              bigclass[0][1]  = '全部论坛';

 

                              bigclass[1]  = new Array();

                              bigclass[1][0]  = '3';

                              bigclass[1][1]  = 'Web 开发';

 

                              bigclass[2]  = new Array();

                              bigclass[2][0]  = '4';

                              bigclass[2][1]  = '软件工程/管理';

 

                       }

 

                     function InitSmallClass()

                     {

                            smallclass  = new Array();

 

                            smallclass[0]  = new Array();

                            smallclass[0][0]  = '301';

                            smallclass[0][1]  = 'ASP';

                            smallclass[0][2]  = '3';         // 此处与上面的大类对应

 

                            smallclass[1]  = new Array();

                            smallclass[1][0]  = '303';

                            smallclass[1][1]  = 'PHP';

                            smallclass[1][2]  = '3';

 

                            smallclass[2]  = new Array();

                            smallclass[2][0]  = '401';

                            smallclass[2][1]  = '软件工程';

                            smallclass[2][2]  = '4';

 

                            smallclass[3]  = new Array();

                            smallclass[3][0]  = '403';

                            smallclass[3][1]  = '软件测试';

                            smallclass[3][2]  = '4';

                     }

 

                     InitBigClass();

                     InitSmallClass();

 

                     function changeitem(myfrm)               // 主要js的函数!!!

                     {      

                            var SelectedBigId,i,j;

                            for (i= myfrm.smallclassid.options.length-1;i>=0  ;--i)      

                            {

                                   myfrm.smallclassid.options[i] = null; 

                            }

              SelectedBigId = myfrm.bigclassid.options[myfrm.bigclassid.selectedIndex].value;

                            j = 0;       

                            for (i=0 ;i< smallclass.length ;i++)      

                            {

                                   if (SelectedBigId == smallclass[i][2])

                                   {

                     myfrm.smallclassid.options[j] = new Option(smallclass[i][1],smallclass[i][0]); 

                                          ++j;

                                   }

                            }

                     }

 

              //-->

              </script> ";

 

       Page.RegisterClientScriptBlock(scriptKey, scriptBlock);      // 注册这个脚本

}

 

第二步:在页面中加入两个<select>

<select > 
(Form
idForm1)

<option value="0" selected>全部论坛</option>

</select>

<select >

<option>请您选择</option>

</select>

注意selectidname属性要与上面的js相一致。

 

第三步:在Button_OnClick()中加入代码

int i;

for(i=0;i<Request.Form.Count;i++)

       if(Request.Form.AllKeys[i].ToString()=="smallclassid")

              break;                          // form中找到这个select (根据id或者name查找)

int SelectValue = Request.Form.GetValues(i)[0];   // 这个值就是select选中的值

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
Asp.NET大文件上传组件开发总结_NET2.0源码下载。发布时间:2022-07-10
下一篇:
ASP.NET域集成AD身份验证发布时间:2022-07-10
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap