禁用多个单选按钮？

Question

我有一个带有多个是/否单选按钮的问题表单，每个按钮都有自己的textarea，只有在＆＃34; No＆＃34;被选中用于该特定问题。问题是设置因为匹配类而仅使用一个问题的工作。 我还没有能够想出一个很好的方法来使每个单选按钮对独一无二，只影响它自己的textarea。

我使用计数器变量为每个组创建不同的类名，但脚本只影响.class1我需要修改脚本并希望得到一些建议。

这是我正在使用的观点的一部分。

@for (int i = 0; i < Model.Questions.Count; i++)
        {
           <tr>
                <td>
                    <div>
                        @Html.RadioButtonFor(p => Model.Questions[i].AnswerSelected, true, new { @class = "class" + i, value = "yes" }) Yes
                        @Html.RadioButtonFor(p => Model.Questions[i].AnswerSelected, false, new { @class = "class" + i, value = "no" }) No
                    </div>
                </td>          
            <td>
                @Html.TextAreaFor(p => Model.Questions[i].ActionToTake, new { id = "text1" })
            </td>
        </tr>
    }

来自检查元素的标记位

<div>
      <input checked="checked" class="class0" data-val="true" data-val-required="The AnswerSelected field is required." id="Questions_0__AnswerSelected" name="Questions[0].AnswerSelected" type="radio" value="True"> Yes
      <input class="class0" id="Questions_0__AnswerSelected" name="Questions[0].AnswerSelected" type="radio" value="False"> No
</div>
<div>
    <textarea class="text0" cols="20" id="text0" name="Questions[0].ActionToTake" rows="2"></textarea>
</div>
    <div>
      <input checked="checked" class="class1" data-val="true" data-val-required="The AnswerSelected field is required." id="Questions_1__AnswerSelected" name="Questions[1].AnswerSelected" type="radio" value="True"> Yes
      <input class="class1" id="Questions_1__AnswerSelected" name="Questions[1].AnswerSelected" type="radio" value="False"> No
</div>
    <textarea class="text1" cols="20" id="text1" name="Questions[1].ActionToTake" rows="2"></textarea>

这是我使用

的脚本

$(document).ready(function() {
$(".class1").change(function (e) {
    if ($(this).val() === 'True') {
        $("#text1").prop('readonly', true);
        $("#text1").css('background-color', '#EBEBE4');
    } else if ($(this).val() === 'False') {
        $("#text1").prop('readonly', false);
        $("#text1").css('background-color', '#FFFFFF');
    }
});
})

有没有好办法解决这个问题？如果您需要更多细节，请告诉我。

（我以前曾问过这个问题，但觉得我在这个问题上不够清楚）

Answer 1

在您的情况下，您可以执行类似

的操作

$(':radio').change(function () {
    $(this).closest('tr').find('[class^="text"]').prop('readonly', $(this).val() === 'False');
});

但是如果你将一些公共类添加到你的无线电输入，textareas及其常见的包装父项中会更好。因此，您将能够使用基于该类的选择器，但不能使用标签名称。