使用 IE8 显示隐藏时出现 ASP.Net JScript 错误

Question

更改下拉列表中的值时出现以下 JavaScript 错误。该错误仅在使用 IE8 时出现，在 IE6 和 IE7 中正常工作。错误是:“value”为 null 或不是对象

这是代码。

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
    <table cellpadding="3" cellspacing="1">
        <tr>
            <td style="text-align: right">* Who is reporting the issue:</td>
            <td>
                <asp:DropDownList ID="ddlWhoReportedIssue" runat="server" 
                    CausesValidation="false">
                    <asp:ListItem></asp:ListItem>
                    <asp:ListItem>Self</asp:ListItem>
                    <asp:ListItem>Agent's Office</asp:ListItem>
                    <asp:ListItem>Other Employee In Dept.</asp:ListItem>
                </asp:DropDownList>
            </td>
        </tr>
        <tr id = "Row1" style="display:none">
            <td style="text-align: right">* State Agent Code:</td>
            <td>
                <asp:TextBox ID="txtStateAgentCode" runat="server" Columns="20" MaxLength="50"></asp:TextBox>
            </td>
        </tr>
        <tr id = "Row2" style="display:none">
            <td style="text-align: right">* Name of Caller:</td>
            <td>
                <asp:TextBox ID="txtNameOfCaller" runat="server"></asp:TextBox>
            </td>
        </tr>
        <tr id = "Row3" style="display:none">
            <td style="text-align: right">* Name &amp; Alias of Other Employee:</td>
            <td>
                <asp:TextBox ID="txtNameAndAlias" runat="server" Columns="30" MaxLength="50"></asp:TextBox>
            </td>
        </tr>
    </table>

    <script type="text/javascript">

        function fcnShowHide1() {
            if (aspnetForm.ctl00_ContentPlaceHolder2_ddlWhoReportedIssue.value == "Self") {
                document.all.Row1.style.display = "none"
                document.all.Row2.style.display = "none"
                document.all.Row3.style.display = "none"
               } else if (aspnetForm.ct100_ContentPlaceHolder2_ddlWhoReportedIssue.value == "Agent's Office") {
                document.all.Row1.style.display = ""
                document.all.Row2.style.display = ""
                document.all.Row3.style.display = "none"
               } else if (aspnetForm.ct100_ContentPlaceHolder2_ddlWhoReportedIssue.value == "Other Employee In Dept.") {
                document.all.Row1.style.display = "none"
                document.all.Row2.style.display = "none"
                document.all.Row3.style.display = ""
            }
        }

    </script>

</asp:Content>

Answer 1

将函数更改为:

function fcnShowHide1() {
    var oDDL = document.getElementById("<%=ddlWhoReportedIssue.ClientID%>");
    var sValue = oDDL.value;
    if (sValue == "Self") {
        document.getElementById("Row1").style.display = "none";
        document.getElementById("Row2").style.display = "none";
        document.getElementById("Row3").style.display = "none";
    } else if (sValue == "Agent's Office") {
        document.getElementById("Row1").style.display = "";
        document.getElementById("Row2").style.display = "";
        document.getElementById("Row3").style.display = "none";
    } else if (sValue == "Other Employee In Dept.") {
        document.getElementById("Row1").style.display = "none";
        document.getElementById("Row2").style.display = "none";
        document.getElementById("Row3").style.display = "";
    }
}

对动态生成的 ID 进行硬编码确实是个坏主意 - 使用 ClientID 获取真实 ID。

加上 document.all 更糟糕，请使用 document.getElementById 代替。