jquery - 禁用第二个文本框

Question

我有一个 jQuery 脚本（如下），如图所示：http: //jsfiddle.net/rLT3b/1/

$('input[type=checkbox]').click(function() {
if(this.checked == true) {
    $(this).closest('td').next().find('input').val("1").removeAttr("disabled"); }
else {
    $(this).closest('td').next().find('input').val("0").attr("disabled", "disabled"); }
});

如何更改它以禁用示例中的第一个文本框？所以当它被取消选中时，两个文本框都被禁用，如果再次选中，两个文本框都被启用。

Answer 1

您可以针对 tr 而不是 td：

演示

$('input[type=checkbox]').click(function() {
if(this.checked == true) {
    $(this).closest('tr').find('input:not(:checkbox)').prop('disabled',false); }
else {
    $(this).closest('tr').find('input:not(:checkbox)').prop('disabled',true); }
});

Answer 2

向上遍历 DOM，然后找到文本输入并切换 'disabled' 属性：

$('input[type="checkbox"]').click(function () {
    $(this).closest('tr').find('input[type="text"]').prop('disabled', !this.checked);
});

演示

注意：[type="text"]使用or[type="checkbox"]比使用:textor更快:checkbox，因为前者利用了原生 CSS 选择器。 请参阅性能测试。