基于jQuery中的复选框在输入上切换禁用属性[重复]答案

【问题标题】：Toggle Disabled Attribute on Input Based on Checkbox in jQuery [duplicate]基于jQuery中的复选框在输入上切换禁用属性[重复]
【发布时间】：2012-12-07 04:27:27
【问题描述】：

我有一个默认未选中的复选框和默认禁用的输入。

<label class="checkbox span3"><input type="checkbox"> I am a full-time student.</label>
<input class="inputIcon span3" id="disabledInput" type="text" placeholder="Enter School Name" disabled>

我可以完全控制类和 id 名称，并且该站点使用 jQuery，因此可以使用它或在需要时使用纯 javascript。

如果用户选中该框，则应从以下输入中删除“禁用”属性。如果用户取消选中它应该再次被禁用。

在 StackOverflow 上发现了几个类似的问题，但似乎都不是这个确切的用例。

【问题讨论】：

您是否尝试过修改这些解决方案？
是的。没有运气，这就是我在这里发帖的原因。

标签： javascript jquery forms

【解决方案1】：

您必须为复选框分配 id 才能将点击绑定到特定的复选框，

Live Demo

<input type="checkbox" id="chk">

$("#chk").click(function(){   
    $("#disabledInput").attr('disabled', !this.checked)
});

【讨论】：

这个选项似乎是最干净的。现在试试看。
注意到函数拼写错误，修复后，它完美运行。谢谢！
谢谢@heavymark，你真好。
最后一个问题。如果默认情况下输入没有“禁用”并且我想选中该框以添加“禁用”并取消选中以将其删除（因此与我上面的示例相反），是否有任何快速更改代码？如果没有，别担心！
你可能需要这个，jsfiddle.net/rajaadil/vwsvE/2

【解决方案2】：

首先给你的复选框一个 id

<input id='cbFullTime' type="checkbox">

然后在其点击处理程序中，获取文本框，并将其禁用的属性设置为复选框checked属性的当前值的倒数：

$('#cbFullTime').click(function() { 
    var cbIsChecked = $(this).prop('checked');
    $('#disabledInput').prop('disabled', !cbIsChecked); 
});

请注意，虽然使用attr 和removeAttr 会起作用（假设您没有完全使用jQuery 1.6），但使用prop 函数更简单，也更正确。欲了解更多信息，请查看this link

【讨论】：

【解决方案3】：

试试下面的

$(".checkbox").find("checkbox").click(function() { 
$('#disabledInput').prop('disabled', $(this).prop('checked')); 
});

【讨论】：