动态隐藏基于单选按钮选中状态的文本框

我在aspx页面上有一组带有相应文本框的单选按钮。我希望文本框显示或隐藏取决于他们的相对单选按钮选中状态。

在页面加载期间，我拉面板上的所有控件，通过每个循环，如果它的类型是单选按钮，我添加javascript函数到单选按钮运行onchange。根据单选复选状态，该函数将显示或隐藏文本框。我不确定如何告诉函数哪个文本框隐藏基于单选按钮，而不是为单选按钮做我自己的属性，并在page_load中使用。对我来说，这是我想到的最好的解决方案，除了内联JS函数调用之外。

但即使这样也没用。

不管我的代码的功能如何，这不是我想要的。我想从面板中获得单选按钮的列表或数组(而不是抓取所有控件)，并向其添加功能。向单选按钮添加属性似乎不是最干净的方式，内联所有调用也不是。不管选择的解决方案路径是什么，我仍然需要知道与单选按钮一起隐藏或显示的文本框。因此，任何帮助、想法和智慧，我们都将感激不尽。 HTML:

<div id="divPersonnel" style="margin-right: auto; margin-left: auto; width: 95%;
                display: block; vertical-align: middle;">
                <asp:Panel ID="pnlPersonnel" runat="server">
                    <div style="width: 300px; margin-right: auto; margin-left: auto;">
                        <asp:Table runat="server" BorderStyle="None" ID="tblPersonnelQuerySelect">
                            <asp:TableRow VerticalAlign="Middle">
                                <asp:TableCell>
                                    <asp:RadioButton ID="rdbID" runat="server" textbox="txbID"/>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:Label class="left" ID="lblID" runat="server" Text="ID:" Style=""></asp:Label>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:TextBox class="right" ID="txbID" runat="server"></asp:TextBox>
                                </asp:TableCell>
                            </asp:TableRow>
                            <asp:TableRow VerticalAlign="Middle">
                                <asp:TableCell>
                                    <asp:RadioButton ID="rdbFN" runat="server" textbox="txbFN"/>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:Label class="left" ID="lblFname" runat="server" Text="First Name:" Style=""></asp:Label>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:TextBox class="right" ID="txbFN" runat="server"></asp:TextBox>
                                </asp:TableCell>
                            </asp:TableRow>
                            <asp:TableRow VerticalAlign="Middle">
                                <asp:TableCell>
                                    <asp:RadioButton ID="rdbLN" runat="server" textbox="txbLN"/>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:Label class="left" ID="lblLName" runat="server" Text="Last Name:" Style=""></asp:Label>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:TextBox class="right" ID="txbLN" runat="server"></asp:TextBox>
                                </asp:TableCell>
                            </asp:TableRow>
                            <asp:TableRow VerticalAlign="Middle">
                                <asp:TableCell>
                                    <asp:RadioButton ID="rdbPR" runat="server" textbox="txbPR"/>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:Label class="left" ID="lblRate" runat="server" Text="Pay Rate:" Style=""></asp:Label>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:TextBox class="right" ID="txbPR" runat="server"></asp:TextBox>
                                </asp:TableCell>
                            </asp:TableRow>
                            <asp:TableRow VerticalAlign="Middle">
                                <asp:TableCell>
                                    <asp:RadioButton ID="rdbSD" runat="server" textbox="dtpkrSD"/><br />
                                    <asp:RadioButton ID="rdbED" runat="server" textbox="dtpkrED"/>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <asp:Label class="left" ID="lblStartDate" runat="server" Text="Start Date:" Style=""></asp:Label>
                                    <br />
                                    <asp:Label class="left" ID="lblEndDate" runat="server" Text="End Date:" Style=""></asp:Label>
                                </asp:TableCell>
                                <asp:TableCell>
                                    <input class="right" id="dtpkrSD" onclick="$(this).datepicker();"/><br />
                                    <input class="right" id="dtpkrED" onclick="$(this).datepicker();"/>
                                </asp:TableCell>
                            </asp:TableRow>
                        </asp:Table>
                    </div>
                </asp:Panel>
            </div>

Javascript:

function toggletxb(rdb, txb) {
        if ($(rdb).attr('checked') == true) {
            $(txb).show();
        }
        else { $(txb).hide(); }
    }

c#(运行于Page_Load):

Control[] ctrsPersonnel = new Control[pnlPersonnel.Controls.Count];
        pnlPersonnel.Controls.CopyTo(ctrsPersonnel, 0);
        foreach (Control _ctr in ctrsPersonnel)
        {
            if (_ctr.GetType() == typeof(RadioButton))
            {
                ((RadioButton)_ctr).Attributes.Add("onclick", "toggleCheckedState($(this));toggletxb($(this), $(#" + ((RadioButton)_ctr).["textbox"] + ");");
                continue;
            }
            else if (_ctr.GetType() == typeof(TextBox))
            {
                ((TextBox)_ctr).Attributes.Add("onload", "$(this).hide();");
                continue;
            }
            else
            {
                continue;
            }
        }

######编辑############

我最终使用数组中的元素id并循环遍历每个索引以添加属性'onclick'和该属性的函数。

html保持不变，c#已被删除。

 //checkbox ids
    var checks = ['<%= chbID.ClientID%>', '<%= chbFN.ClientID%>', '<%= chbLN.ClientID%>', '<%= chbPR.ClientID%>', '<%= chbDtPkrSD.ClientID%>', '<%= chbDtPkrED.ClientID%>',
                        '<%= chbUID.ClientID%>', '<%= chbUsername.ClientID%>', '<%= chbActivityID.ClientID%>', '<%= chbIP.ClientID %>', '<%= chbFormAccessed.ClientID %>', '<%= chbDOA.ClientID %>'];
// text box ids
    var texts = ['<%= txbID.ClientID%>', '<%= txbFN.ClientID%>', '<%= txbLN.ClientID%>', '<%= txbPR.ClientID%>', 'txbDtPkrSD', 'txbDtPkrED',
                        '<%= txbUID.ClientID%>', '<%= txbUsername.ClientID%>', '<%= txbActivityID.ClientID%>', '<%= txbIP.ClientID %>', '<%= txbFormAccessed.ClientID %>', 'dtpkrDOA'];

//loop through each id and add the functions
        for (var i = 0; i < checks.length; i++) {
            $('#' + checks[i]).attr('onclick', 'toggletxb($(this),$("#' + texts[i] + '"))');
            $('#' + texts[i]).hide();
        }

###### END EDIT