选中一行中的所有复选框时如何选中复选框？

Question

嗨，所有其他复选框检查了我的意思是什么，我该如何检查复选框 我有一个看起来像这样的 div 表

<div id="Row-8">
    <span class="span2">
        <label class="checkbox">
            <input type="checkbox" class="regular-checkbox" onchange="checkallrowcheckboxes(this)" value="8" name="selectedObjects" id="8"><label for="rowcommoncheckbox-8"></label></label></span>
    <span class="span2">AddOrEdit</span>
    <span class="span2">
        <label class="checkbox">
            <input type="checkbox" value="8" class="regular-checkbox" name="chkAdd" id="Add-8"><label for="Add-8"></label></label></span>
    <span class="span2">
        <label class="checkbox">
            <input type="checkbox" value="8" class="regular-checkbox" name="chkEdit" id="Edit-8"><label for="Edit-8"></label></label></span>
    <span class="span2">
        <label class="checkbox">
            <input type="checkbox" value="8" class="regular-checkbox" name="chkDel" id="Delete-8"><label for="Delete-8"></label></label></span>
    <span class="span2">
        <label class="checkbox">
            <input type="checkbox" value="8" class="regular-checkbox" name="chkview" id="View-8"><label for="View-8"></label></label></span>
</div>

看起来像这样

ChkColumn  PageName Chk1 Chk2 Chk3 Chk4

我想要的是当右侧 os 行中的所有复选框都被选中时，左侧复选框应该被自动选中..即 Chkcolumn 应该在 Chk1 Chk2 Chk3 Chk4 被检查时自动检查..

Answer 1

无耻的自我推销：这似乎是a jQuery plugin I've written 的完美用例。

试试这个：

$('#Row-8 input[type="checkbox"]:first')
    .checkAll('#Row-8 input[type="checkbox"]:not(:first)');​

演示：http://jsfiddle.net/mattball/9ErH6

Answer 2

在这里演示：http://jsfiddle.net/Mx4q2/

我在复选框中添加了一些“驱动”/“驱动”类，然后使用了这个脚本：

function driveCheckbox(event){
    var $currentRow = $(this).parents('.row');

    var $checkedDrivers = $currentRow.find('.driving-checkbox:checked');
    if($checkedDrivers.length == 4){
        $currentRow.find('.driven-checkbox').prop('checked', true);
    } else {
        $currentRow.find('.driven-checkbox').prop('checked', false);
    }
}

function selectAll(event){

    var $currentRow = $(this).parents('.row');

    var $targets = $currentRow.find('.driving-checkbox');
    if($(this).is(':checked')){
        $targets.prop('checked', true);
    } else {
        $targets.prop('checked', false);
    }
}
$('.driving-checkbox').change(driveCheckbox);
$('.driven-checkbox').change(selectAll);

​

Answer 3

$(function() {
    $('#Row-8 input').change(function() {
        var add8 = $('#Add-8').is(':checked');
        var edit8 = $('#Edit-8').is(':checked');
        var delete8 = $('#Delete-8').is(':checked');
        var view8 = $('#View-8').is(':checked');
        if (add8 && edit8 && delete8 && view8) {
            $('#Row-8 input').attr('checked',false);
            $('#8').attr('checked',true);
        }
    });
});