从具有母版页的页面中存在的javascript访问RadioButtonList时出错

Question

我有一个具有母版页的asp.net页，它包含RadioButtonList1，我尝试执行以下操作：

<script type="text/javascript">


            var radioButtonList = document.getElementById('<%=RadioButtonList1.ClientID%>');
            if(radioButtonList[0].checked)
                document.getElementById("_secondTR").style.display = "block";
            else if (radioButtonList[1].checked )
                document.getElementById("_secondTR").style.display = "none";
        }  
</script>

<table style="width: 100%">
    <tr id="Tr1">
        <td>
            <asp:RadioButtonList ID="RadioButtonList1" runat="server"  BackColor="#FFCC99"
                RepeatDirection="Horizontal" Width="117px" onclick="ShowHide()">
                <asp:ListItem Value="1">Yes</asp:ListItem>
                <asp:ListItem Value="0">No</asp:ListItem>
            </asp:RadioButtonList>
        </td>
    </tr>
    <tr id="_secondTR" runat="server" style="display: none">
        <td>
            <asp:RadioButton ID="Five" runat="server" GroupName="1" BackColor="#669999" />
            <asp:RadioButton ID="Four" runat="server" GroupName="1" CausesValidation="True" BackColor="#669999" />
        </td>
    </tr>
</table>

我无法从JavaScript获取RadioButtonList1。

Answer 1

以下是浏览器看到的实际javascript代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
    Untitled Page
</title>
</head>
<body>
    <form name="aspnetForm" method="post" action="Default.aspx" id="aspnetForm">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTY3MTM1NjkwNw9kFgJmD2QWAgIDD2QWAgIBD2QWAgIBD2QWAgIBDxYCHgVzdHlsZQUNZGlzcGxheTpub25lO2QYAQUeX19Db250cm9sc1JlcXVpcmVQb3N0QmFja0tleV9fFgQFLmN0bDAwJENvbnRlbnRQbGFjZUhvbGRlcjEkV2ViVXNlckNvbnRyb2wxJEZpdmUFLmN0bDAwJENvbnRlbnRQbGFjZUhvbGRlcjEkV2ViVXNlckNvbnRyb2wxJEZpdmUFLmN0bDAwJENvbnRlbnRQbGFjZUhvbGRlcjEkV2ViVXNlckNvbnRyb2wxJEZvdXIFLmN0bDAwJENvbnRlbnRQbGFjZUhvbGRlcjEkV2ViVXNlckNvbnRyb2wxJEZvdXLEUVfizbUknWTXdgpHXciIE+acfQ==" />
</div>

<div>

    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWBgLV9tHzCQLJ7qOsBgLW7qOsBgLGgYnCCgKixI2BBALP88ewCU+8LBEmqBjXFfT7h0XYnYX89px3" />
</div>
    <div>
        asda sd sd as das



<script type="text/javascript">
        function ShowHide()
        {
  var radioButtonList = document.getElementById('ctl00_ContentPlaceHolder1_WebUserControl1_RadioButtonList1');

            if(radioButtonList[0].checked)
                document.getElementById("_secondTR").style.display = "block";
            else if (radioButtonList[1].checked )
                document.getElementById("_secondTR").style.display = "none";
        }  
</script>

<table style="width: 100%">
    <tr id="Tr1">
        <td>
            <table id="ctl00_ContentPlaceHolder1_WebUserControl1_RadioButtonList1" onclick="ShowHide()" border="0" style="background-color:#FFCC99;width:117px;">
    <tr>
        <td><input id="ctl00_ContentPlaceHolder1_WebUserControl1_RadioButtonList1_0" type="radio" name="ctl00$ContentPlaceHolder1$WebUserControl1$RadioButtonList1" value="1" /><label for="ctl00_ContentPlaceHolder1_WebUserControl1_RadioButtonList1_0">Yes</label></td><td><input id="ctl00_ContentPlaceHolder1_WebUserControl1_RadioButtonList1_1" type="radio" name="ctl00$ContentPlaceHolder1$WebUserControl1$RadioButtonList1" value="0" /><label for="ctl00_ContentPlaceHolder1_WebUserControl1_RadioButtonList1_1">No</label></td>
    </tr>
</table>
        </td>
    </tr>
    <tr id="ctl00_ContentPlaceHolder1_WebUserControl1__secondTR" style="display:none;">
    <td>
            <span style="background-color:#669999;"><input id="ctl00_ContentPlaceHolder1_WebUserControl1_Five" type="radio" name="ctl00$ContentPlaceHolder1$WebUserControl1$1" value="Five" /></span>
            <span style="background-color:#669999;"><input id="ctl00_ContentPlaceHolder1_WebUserControl1_Four" type="radio" name="ctl00$ContentPlaceHolder1$WebUserControl1$1" value="Four" /></span>
        </td>
</tr>

</table>


    </div>
    </form>
</body>
</html>

Answer 2

.net为您的按钮列表生成一个表，radioButtonList引用该表，以获取按钮，您需要添加以下内容：

 radioButtonList = radioButtonList.getElementsByTagName ('input');

那解决了您眼前的问题，但是getElementById（'_secondTR'）引发错误。

将javascript更改为以下内容似乎可以完成所需的操作。

function ShowHide () {
  var radioButtonList = document.getElementById ('ctl00_ContentPlaceHolder1_WebUserControl1_RadioButtonList1');
  radioButtonList = radioButtonList.getElementsByTagName ('input');
  if (radioButtonList[0].checked)
    document.getElementById ("ctl00_ContentPlaceHolder1_WebUserControl1__secondTR").style.display = "block";
  else if (radioButtonList[1].checked )
    document.getElementById ("ctl00_ContentPlaceHolder1_WebUserControl1__secondTR").style.display = "none";
}

我将不得不请一位.net专家来告诉您如何干净地生成此脚本。

从具有母版页的页面中存在的javascript访问RadioButtonList时出错

问题描述

2 个解决方案

解决方案1
0 2010-03-13 09:41:24

解决方案2
0 2010-03-13 10:18:20

从具有母版页的页面中存在的javascript访问RadioButtonList时出错

问题描述

2 个解决方案

解决方案1 0 2010-03-13 09:41:24

解决方案2 0 2010-03-13 10:18:20

解决方案1
0 2010-03-13 09:41:24

解决方案2
0 2010-03-13 10:18:20