目標達到的效果：兩個下拉框，第二個跟隨第一個變化而變化，使用客戶端腳本JavaScript在ASP.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?id="bigclassid"?οnchange="javascript:changeitem(document.Form1);"?name=?"bigclassid">?(Form的id為Form1)

<option?value="0"?selected>全部論壇</option>

…

</select>

<select?id="smallclassid"?name="smallclassid">

<option>請您選擇</option>

</select>

注意select的id和name屬性要與上面的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 選中的值
?

總結

以上是生活随笔為你收集整理的asp.net中的联动菜单的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。