当一行中的所有复选框都被选中时，如何选中该复选框？

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

我想要的是，当右边的所有复选框都被选中时，左边的复选框应该被自动选中。也就是说，当Chk1 Chk2 Chk3 Chk4被选中时，应该自动选中Chk4列。

Answer 1

演示：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 2

无耻的自我推销:这似乎是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 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);
        }
    });
});