Asp.net 选择文本框时，如何选择单选按钮？

我在

单选按钮旁边有一个
文本框
，当有人选择
文本框
时，它应该将相关的
单选按钮
设置为选中状态

我一直在使用这个代码，直到我注意到它只适用于Chrome：

<asp:RadioButton runat="server" GroupName="SomeGroup" ID="rbOption3" />
<asp:Label runat="server" AssociatedControlID="rbOption3">
    <asp:Label runat="server" Text="Pay other amount" />
    <asp:TextBox runat="server" ID="txtOtherAmount" CssClass="money-text" />
    <div class="align-with-radiobutton small-text">
        The minimum amount for web payments is <asp:Label runat="server" ID="lblMinPayment" />. If you are looking to pay a lower
        amount, please <a href="Contact.aspx">contact us</a> and speak with a representative.
    </div>
</asp:Label>

并与代表交谈。


它在所有3个主要浏览器中的行为都不同

即：选择文本框时，选择内容根本不会改变

FireFox:选择在
MouseUp
上更改，这意味着无论何时选择文本框，焦点都将更改为单选按钮，这使得文本框似乎无法选择

Chrome:工作正常，因为选择在
MouseDown

我的要求是，用户可以选择文本的任何部分或文本框，它将选择单选按钮

当文本框通过鼠标或键盘导航获得焦点时，如何选择相关的单选按钮

编辑

发布的解决方案适用于IE和Chrome，但在FireFox上仍然失败。当您在FireFox中选择文本框时，RadioButton会将焦点转移到鼠标上，这使得文本框看起来无法被选择

我尝试过使用一些jQuery，但是
.changed（）
和
.focus（）
在选择文本框时不会被触发（虽然它们在选择标签时被触发），而且我似乎无法停止事件。
以下方法在IE、Firefox和Chrome的最新版本中对我有效：

<script type="text/javascript">
    function selectRadio3() {
        var rb = document.getElementById('<%= rbOption3.ClientID %>');
        rb.checked = true;
    }

    function selectOtherAmount() {
        var txt = document.getElementById('<%= txtOtherAmount.ClientID %>');
        txt.focus();
    }
</script>

<asp:RadioButton runat="server" GroupName="SomeGroup" ID="rbOption3" onclick="javascript:selectOtherAmount()" />
<asp:Label ID="Label1" runat="server" AssociatedControlID="txtOtherAmount" Text="Pay other amount" />
<asp:TextBox runat="server" ID="txtOtherAmount" onfocus="javascript:selectRadio3()" CssClass="money-text" />
<div class="align-with-radiobutton small-text" onclick="javascript:selectOtherAmount()">
    The minimum amount for web payments is <asp:Label runat="server" ID="lblMinPayment" />. If you are looking to pay a lower
    amount, please <a href="Contact.aspx">contact us</a> and speak with a representative.
</div>

巴罗的回答是正确的

但是，如果您使用的是jquery，那么下面是它的工作方式：

jquery的优点是您不必担心不同的浏览器。它“只适用于”所有浏览器。
我想我不应该试图简化我的代码。。。我已经更新了我的问题，在有问题的文本框下面显示了一段额外的文本。我需要能够选择文本的任何部分或文本框来选择单选按钮。您可以将文本包装在div中，并为div添加onclick事件。依赖javascript可能不是更好的选择，但我只是不认为浏览器都能很好地使用
标签中的
文本框
。我用div上的
onclick
更新了我的答案，它在我的测试代码中运行得很好。我想我可以用它。。。但情况不太一样。例如，当您将鼠标悬停在单选按钮上时，它不会高亮显示该按钮。我希望有办法保持与RadioButton关联的标签，并使文本框正常工作。@Rachel:请检查我答案的更新。我将HTML与您在问题中发布的内容保持一致，只是添加了几个javascript事件。当任何元素悬停在上方时，我看到单选按钮高亮显示。因为这可能很重要，所以我的doctype是XHTML过渡版。另外，当我尝试验证XHTML时，它失败了，因为显然出于验证目的，您不允许在
中使用
，可能需要使用
显示：block
将其切换为
。它适用于IE和Chrome，但是我仍然有FF的问题，选择
文本框
会选择
鼠标上的
单选按钮
，这使得文本框似乎无法选择。我正在使用FF8进行测试，它只适用于鼠标导航。它不适用于键盘导航，例如切换到文本框。我也无法得到巴罗关于Firefox工作的答案，这是一件容易做到的事情。只需替换.click函数即可.focus。签出我添加了另一个文本框，只是为了让你可以在你想要触发.focus方法的实际文本框中添加标签！虽然看起来很粗糙。。。例如，将鼠标悬停在文本上不会像应该的那样突出显示RadioButton，并且光标是不同的。我还必须记住将点击事件添加到RadioButton中的任何文本中（您的小提琴只有一半上有点击事件）。不过在巴罗的帮助下我成功了。最后我完成了两个焦点事件，一个在文本框上选择收音机，另一个在radio按钮上聚焦文本框。
<script type="text/javascript">
    function selectRadio3() {
        var rb = document.getElementById('<%= rbOption3.ClientID %>');
        rb.checked = true;
    }

    function selectOtherAmount() {
        var txt = document.getElementById('<%= txtOtherAmount.ClientID %>');
        txt.focus();
    }
</script>

<asp:RadioButton runat="server" GroupName="SomeGroup" ID="rbOption3" onclick="javascript:selectOtherAmount();" />
<asp:Label ID="Label1" runat="server" AssociatedControlID="rbOption3">
    <asp:Label ID="Label2" runat="server" Text="Pay other amount" />
    <asp:TextBox runat="server" ID="txtOtherAmount" CssClass="money-text" onfocus="javascript:selectRadio3();" />
    <div class="align-with-radiobutton small-text">
        The minimum amount for web payments is <asp:Label runat="server" ID="lblMinPayment" />. If you are looking to pay a lower
        amount, please <a href="Contact.aspx">contact us</a> and speak with a representative.
    </div>
</asp:Label>