jquery 多选框 全选

 

 HTML

<table width="200px">
    <tr>
        <td><input type="checkbox" class="checkbox"></td>
        <td>ID</td>
        <td>名字</td>
    </tr>
    <tr>
        <td><input type="checkbox" class="checkboxs"></td>
        <td>1</td>
        <td>张三</td>
    </tr>
    <tr>
        <td><input type="checkbox" class="checkboxs"></td>
        <td>1</td>
        <td>李四</td>
    </tr>
    <tr>
        <td><input type="checkbox" class="checkboxs"></td>
        <td>1</td>
        <td>王五</td>
    </tr>
    <tr>
        <td><input type="checkbox" class="checkboxs"></td>
        <td>1</td>
        <td>赵六</td>
    </tr>
    <tr>
        <td><input type="checkbox" class="checkboxs"></td>
        <td>1</td>
        <td>田七</td>
    </tr>
    <tr>
        <td><input type="checkbox" class="checkboxs"></td>
        <td>1</td>
        <td>秦八</td>
    </tr>
</table>

jquery

$('.checkbox').change(function () {
    if($('.checkbox').prop('checked')){
        $('.checkboxs').prop('checked',true);
    }else{
        $('.checkboxs').prop('checked',false);
    }
})
$('.checkboxs').change(function () {
    $x=0;
    $('.checkboxs').each(function () {
        $x++;
    })
    if($('.checkboxs:checked').length==$x){
        $('.checkbox').prop('checked',true);
    }else{
        $('.checkbox').prop('checked',false);
    }
})