启用/禁用字段的单选按钮答案

【问题标题】：Radio buttons to enable/disable fields启用/禁用字段的单选按钮
【发布时间】：2012-10-17 19:51:18
【问题描述】：

我有一个包含几组单选按钮的表单。选择一个单选按钮将启用text 字段并禁用其余字段。我无法启用该字段。我已经尝试了几乎所有功能（next、nextAll、nextUnit、find、findAll、closest ...），但可能没有正确使用它们。

这是一个只有一组按钮的测试：http://jsfiddle.net/QTseK/

在页面加载时，一些单选按钮已经被选中，我必须运行什么才能禁用其余（未选中的字段）？

谢谢

【问题讨论】：

标签： javascript jquery jquery-selectors

【解决方案1】：

由于您的元素具有类属性，您可以使用类选择器选择它们，启用/禁用表单元素，您可以使用prop 方法。

$("body").on("click", "input[type='radio']", function() {
    $('.fieldSelector').prop('disabled', true);
    $(this).closest('tr').find('.fieldSelector').prop('disabled', false)
});

http://jsfiddle.net/AfRdj/

【讨论】：

还有$("input[type^='radio']").not(':checked').each 用于在启动时禁用字段。谢谢

【解决方案2】：

jsFiddle

$("body").on("click", "input[type=radio]", function() {
   $(this).closest("table").find("input[type=text]").prop("disabled", true);
    $(this).closest("tr").find("input[type=text]").prop("disabled", false);

});

您可以根据您的 HTML 添加/修改选择器。

另外，我不确定我是否会将事件监听器放在 body 上。如果元素在整个页面生命周期中都在 DOM 中，我认为我更喜欢这样的东西。（最初是页面上的问题元素吗？）

$("input[type=radio]").on("click", function() {//you can change input[type=radio] to any other selector that you have already used
   $(this).closest("table").find("input[type=text]").prop("disabled", true);
    $(this).closest("tr").find("input[type=text]").prop("disabled", false);

});

【讨论】：