JS 操作级联

<asp:DropDownList runat="server" ID="ddlPageType" name="ddlPageType" Width="100px"
                            οnchange="Redirect(this.options.selectedIndex)">
                            <asp:ListItem Value="1" Text="首页" />
                            <asp:ListItem Value="2" Text="职位搜索" />
                            <asp:ListItem Value="6" Text="校园招聘" />
                            <asp:ListItem Value="7" Text="培训频道" />
                        </asp:DropDownList>
                        &nbsp;&nbsp;
                        <asp:DropDownList runat="server" ID="ddlWebName" name="ddlWebName">
                            <asp:ListItem Value="3" Text="首页品牌(370X53)" />
                            <asp:ListItem Value="4" Text="首页品牌(180X53)" />
                            <asp:ListItem Value="5" Text="名企招聘(370X53)" />
                            <asp:ListItem Value="8" Text="名企招聘(180X53)" />
                            <asp:ListItem Value="9" Text="紧急招聘(180X53)" />
                            <asp:ListItem Value="10" Text="首页(180X110)" />
                            <asp:ListItem Value="11" Text="首页(180X72)" />
                            <asp:ListItem Value="12" Text="首页(180X200)" />
                            <asp:ListItem Value="13" Text="首页(180X100)" />
                            <asp:ListItem Value="14" Text="首页(190X120)" />
                        </asp:DropDownList>

                        <script type="text/javascript">
                            var groups = document.getElementById("ddlPageType").options.length;
                            var group = new Array(groups)
                            for (i = 0; i < groups; i++)
                                group[i] = new Array()

                            group[0][0] = new Option("首页品牌(370X53)", "3")
                            group[0][1] = new Option("首页品牌(180X53)", "4")
                            group[0][2] = new Option("名企招聘(370X53)", "5")
                            group[0][3] = new Option("名企招聘(180X53)", "8")
                            group[0][4] = new Option("紧急招聘(180X53)", "9")
                            group[0][5] = new Option("首页(180X110)", "10")
                            group[0][6] = new Option("首页(180X72)", "11")
                            group[0][7] = new Option("首页(180X200)", "12")
                            group[0][8] = new Option("首页(180X100)", "13")
                            group[0][9] = new Option("首页(190X120)", "14")

                            group[1][0] = new Option("职位搜索", "2")

                            group[2][0] = new Option("校园招聘", "6")

                            group[3][0] = new Option("培训频道", "7")

                            var temp = document.getElementById("ddlWebName");

                            function Redirect(x) {
                                //alert(x);
                                for (m = temp.options.length - 1; m > 0; m--)
                                    temp.options[m] = null
                                for (i = 0; i < group[x].length; i++) {
                                    temp.options[i] = new Option(group[x][i].text, group[x][i].value);
                                   // alert(group[x][i].value);
                                }

                                temp.options[0].selected = true
                            }
                        </script>

 

 

--- 第二方法

 

<script language="JavaScript">
                            function setcity() {
                                switch (document.form1.ddlPageType.value) {
                                    case '1':
                                        var labels = new Array("北京市");
                                        var values = new Array("北京市");
                                        break;
                                    case '2':
                                        var labels = new Array("天津市");
                                        var values = new Array("天津市");
                                        break
                                    case '3':
                                        var labels = new Array("上海市");
                                        var values = new Array("上海市");
                                        break
                                    case '4':
                                        var labels = new Array("广州", "深圳", "东莞", "中山", "佛山", "珠海", "惠州", "汕头", "湛江", "潮州", "潮阳", "江门", "汕尾", "茂名", "阳江", "肇庆", "梅州", "云浮", "清远", "韶关", "河源", "揭阳", "其他");
                                        var values = new Array("广州", "深圳", "东莞", "中山", "佛山", "珠海", "惠州", "汕头", "湛江", "潮州", "潮阳", "江门", "汕尾", "茂名", "阳江", "肇庆", "梅州", "云浮", "清远", "韶关", "河源", "揭阳", "其他");
                                        break
                                }

                                document.form1.ddlWebName.options.length = 0;
                               
                                for (var i = 0; i < labels.length; i++) {
                                    document.form1.ddlWebName.add(document.createElement("OPTION"));
                                    document.form1.ddlWebName.options[i].text = labels[i];
                                    document.form1.ddlWebName.options[i].value = values[i];
                                    if (document.form1.ddlWebName.options[i].value == "<%=webName %>") {
                                        document.form1.ddlWebName.options[i].selected = true;
                                    }

                                }
                            }
                        </script>

                        <select name="ddlPageType" οnchange="setcity()" id="ddlPageType" runat="server">
                            <option value="1">首页 </option>
                            <option value="2">职位搜索 </option>
                            <option value="3">校园招聘 </option>
                            <option value="4">培训频道 </option>
                        </select>
                        &nbsp;&nbsp;
                        <select name="ddlWebName" id="ddlWebName" runat="server">
                        </select>
                        <script language="JavaScript">
                            setcity();
                        </script>