在单选按钮组中，如何使其中 2 个启用文本框，其中一个禁用/只读文本框答案

【问题标题】：In radio button group, how can I make 2 of them enable a textbox and one of them disable/readonly the textbox在单选按钮组中，如何使其中 2 个启用文本框，其中一个禁用/只读文本框
【发布时间】：2015-10-23 18:17:51
【问题描述】：

我有 3 个单选按钮，我需要其中的 2 个来启用文本框。

到目前为止，我已将其设置如下。

<form id="form1" name="form1" method="post" action="">
    <table width="250">
        <tr>
            <td>
                <label>
                    <input type="radio" name="RadioGroup1" value="B1" id="RadioGroup1_0" />Quote
                </label>
            </td>
            <td>
                <label>
                    <input type="radio" name="RadioGroup1" value="B2" id="RadioGroup1_1" />Bind
                </label>
            </td>
            <td>
                <label>
                    <input type="radio" name="RadioGroup1" value="B3" id="RadioGroup1_2" />Quote/Bind
                </label>
            </td>
        </tr>
    </table>
    <br />
    <label> 
        Effective Date/Time  
        <input name="EffDate" type="text" id="EffDate" placeholder="yyyy/mm/dd hh:mm HRS" disabled="disabled"/>
    </label>
</form>

我设置了一个按钮来启用文本框

$('#RadioGroup1_1').change(function(){
    $('#EffDate').removeAttr('disabled');
});

$('#RadioGroup1_2').change(function(){
    $('#EffDate').removeAttr('disabled');
});

我的问题是，单击 RadioGroup1_1 或 1_2 后，“effdate”文本框不会回到其禁用状态。我只希望在选择单选按钮时启用该框。

我已经尝试过调查，但找不到我的具体答案，为了全面披露，这对我来说是全新的！

谢谢！

【问题讨论】：

首先，如果我回答正确，您不能启用多个单选按钮。使用复选框，您可以启用多个选项
JQuery - checkbox enable/disable的可能重复
@EgySuccess - 您可以启用多个单选按钮，但您不能在同一组中一次检查多个.但这不是问题所在。
@nnnnnn 是的，你做到了，我的意思是谢谢

标签： javascript jquery html

【解决方案1】：

单选按钮很棘手：当一个按钮发生变化时，它们都会发生变化（当然都在同一个组中），但只有其中一个会收到事件！

我喜欢使用“点击”而不是“更改”，因为旧版本的 IE 在元素失去焦点之前不会触发“更改”。

$(document).on("click synchronize", "input[name='RadioGroup1']", function() {
    $("#EffDate").prop("disabled", $("#RadioGroup1_1:checked, #RadioGroup1_2:checked").length > 0);
});
$("#RadioGroup1_0").trigger("synchronize");

因此，对三个单选按钮中的任何一个的任何点击都会触发该“点击”处理程序。处理程序将检查按钮 1 或按钮 2 是否被选中，并从中设置文本字段的“禁用”属性。

【讨论】：

【解决方案2】：

需要将元素的disabled属性设置为true/false：

$('#RadioGroup1_1, #RadioGroup1_2').click(function() {
    $('#EffDate').prop('disabled', false);
});
$('#RadioGroup1_0').click(function() {
    $('#EffDate').prop('disabled', true);
});

注意：您 should 在复选框/收音机上使用 .click 而不是 .change。

【讨论】：

【解决方案3】：

您必须使用.prop('disabled', true) 或.prop('disabled', false) 来切换禁用状态。使用.attr 并不总是有效。

【讨论】：