js实现 当选中DropDownList第五项时，panel显示，否则隐藏。

Question

求教了，谢谢大家！

Answer 1

DropDownList写个onchange事件，并且在panel外套一个div给个id，JS里选择地5项就获取div，.style.display="block";就ok了

Answer 2

if(document.getElementById("select").selectedIndex==4)

Answer 3

$("panel").style.dispaly = $("ddl").selectedIndex == 4 ? "" : "none";

Answer 4

页面加载后，DropDownList默认选中第一项，这时候问题出现了：在onchange事件中写的方法无效，panel此时是显示状态的，我要的是panel在页面加载后是隐藏的，只有选中第五项的时候才显示。让panel隐藏我本来就会的，关键在于：页面加载后第一次怎样让panel隐藏，选中第五项时再显示，请帮帮忙，谢谢了！！

Answer 5

如果用div是行得通的，效果很不错。但是不套div直接用panel就不行了，因为一开始设置了panel的visible为false，所以页面加载过后，源代码中是没有的，这时候无法让panel显示，悲剧。

Answer 6

Panel外面套个Div可以解决：
js代码：
function hidework() {
         var ddl1 = document.getElementById("ddlworkexp");
         var getvalue = ddl1.options(ddl1.selectedIndex).value; //得到ID
         //            var gettext = ddl1.options(ddl1.selectedIndex).text; //得到显示值
         if (getvalue == 4) {
             document.getElementById("d1").style.display = "block";
         }
         else {
             document.getElementById("d1").style.display = "none";
         }
     }HTML代码：
<td>
                        <asp:DropDownList ID="ddlworkexp" runat="server" AutoPostBack="False" onchange="javascript:hidework();">//在事件中调用js中的函数。
                            <asp:ListItem Value="0">不限</asp:ListItem>
                            <asp:ListItem Value="1">1年以下</asp:ListItem>
                            <asp:ListItem Value="2">1-3年</asp:ListItem>
                            <asp:ListItem Value="3">3-5年</asp:ListItem>
                            <asp:ListItem Value="4">自定义</asp:ListItem>
                        </asp:DropDownList>
                    </td>
                    <td>
                    <div id="d1" style="display:none">//默认设置div不可见。
                        <asp:Panel ID="pnlworkexp" runat="server" Visible="True">
                            从：<asp:DropDownList ID="ddlwkstart" runat="server">
                                <asp:ListItem>3年</asp:ListItem>
                                <asp:ListItem>5年</asp:ListItem>
                                <asp:ListItem>10年</asp:ListItem>
                                <asp:ListItem>15年</asp:ListItem>
                            </asp:DropDownList>
                            到：<asp:DropDownList ID="ddlwkend" runat="server">
                                <asp:ListItem>5年</asp:ListItem>
                                <asp:ListItem>10年</asp:ListItem>
                                <asp:ListItem>15年</asp:ListItem>
                                <asp:ListItem>20年</asp:ListItem>
                                <asp:ListItem>30年</asp:ListItem>
                            </asp:DropDownList>
                        </asp:Panel>
                        </div>
                    </td>

Answer 7

楼主，，panel其实都没必要要，你div就ok'了，，页面div的display设为none，，这样，只要不选则5项，永远都是影藏，选择5项就显示div