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行中的所有复选框时，应自动检查左侧复选框。如果Chk1 Chk2 Chk3 Chk4被嘲笑，应自动检查Chkcolumn ..

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

$(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);
        }
    });
});

Answer 3

在这里演示：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);

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

3 个答案: