Question

我想在选中其他复选框时自动选中复选框。

以下是我正在使用的代码，但无效：

<table class='block'>
<tr>
<td>
<input class='cb1' type='checkbox'><label>Checkbox 1</label>
</td>
<td>
<input class='cb2' type='checkbox'><label>Checkbox 2</label>
</td>
<td>
<input class='cb2' type='checkbox'><label>Checkbox 2</label>
</td>
</tr>
</table>

<table class='block'>
<tr>
<td>
<input class='cb1' type='checkbox'><label>Checkbox 1</label>
</td>
<td>
<input class='cb2' type='checkbox'><label>Checkbox 2</label>
</td>
<td>
<input class='cb2' type='checkbox'><label>Checkbox 2</label>
</td>
</tr>
</table>

<script type='text/javascript'>
$(document).ready(function(){
    $('.block .cb1').click(function(){
        if($(this).is(':checked'))
            {

                $(this).parent().find('.cb2').attr('checked','checked');
            }
        else
            {
                $(this).parent().find('.cb2').removeAttr('checked');
            }
    });
});
</script>

我试图让它只检查来自检查'cb1'的同一个表的'cb2'。

Answer 1

您需要将parent()替换为closest('table')（或closest('tr')，对于显示的HTML）调用。请注意，复选框元素的直接父项是<td>元素 - 显然不包含任何其他复选框。您需要进一步向上查找包含所有其他复选框作为后代的元素。

Answer 2

您的代码正在cb2内搜索一个类<td>的元素正弦您的选择器为.parent() ..它必须经过第三个父级别才能到达<table>元件..

所以请使用parents()和eq()

$(this).parents().eq(3).find('.cb2').attr('checked','checked');

*OR*

$(this).parents().eq(2).find('.cb2').attr('checked','checked'); // since all your checkbox is under <tr>

这是小提琴..

http://jsfiddle.net/MKSgf/

Answer 3

尝试此代码，因为您使用父（）选择td而不是tr

(this).parent().parent().find('.cb2').attr('checked','checked');

如果要选择第一个cb2复选框，请尝试此

 $(this).parent().parent().find('.cb2').first().attr('checked','checked');

DEMO

jquery复选框按类自动从同一个表中选择其他

3 个答案: