javascript - 如何在检查同级输入时禁用输入？

Question

我有以下代码:

<table>
 <tr class="name"><td><input type="hidden" value="name1" name="name"></td><td><input type="checkbox"></td></tr>
 <tr class="name"><td><input type="hidden" value="name2" name="name"></td><td><input type="checkbox"></td></tr>
</table>

我尝试过:

$('.name').find("input[type='checkbox']").change(function(){
        var check = $(this).attr('checked');
        $(this).find(input[type='hidden']).attr('disable',!check )
      })

我希望当选中checkbox时，输入type="hidden将被禁用，但它在我的代码中工作错误!

Answer 1

附加“更改”事件的处理程序，查找最近的父行并根据是否选中复选框来打开/关闭禁用属性。

$('input[type="checkbox"]').on('change', function() {
    var $this = $(this);
    var $row = $this.closest('tr');
    $row.find('input[type="hidden"]').prop('disabled', this.checked);
});

旁注:问题不包含任何显示您尝试过的内容的代码，并且您可以看到答案非常简单。

尚未测试过，您可能需要将 .prop 与 .attr 切换。
JSFiddle 代码由 Nathan Champion 提供 jsfiddle.net/3qg6Ljev

如果您需要更多的行输入，那么您需要向隐藏输入添加一个类，该类应与复选框配对使用，并改用 .find('input.class')。