在 jQuery 中切换输入上的禁用属性复选框



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

<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上发现了几个类似的问题,但似乎没有一个是这个确切的用例。

您必须将 id 分配给复选框才能将单击绑定到特定复选框,

现场演示

<input type="checkbox" id="chk">
$("#chk").click(function(){   
    $("#disabledInput").attr('disabled', !this.checked)
});

首先给你的复选框一个 ID

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

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

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

请注意,虽然使用 attrremoveAttr 就可以了(假设你没有完全使用 jQuery 1.6),但使用 prop 函数更简单一些,也更正确一些。 有关更多信息,请查看此链接

尝试以下操作

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

最新更新