0

我有一个类似这样的 DOM 结构（由于过度拥挤，我不想显示其他 td）：

<table>
<tr><td><input type="checkbox" name="checkbox1" class="rowSelectCheckbox"></td></input></tr>
<tr><td><input type="checkbox" name="checkbox2" class="rowSelectCheckbox"></td></input></tr>
<tr><td><input type="checkbox" name="checkbox3" class="rowSelectCheckbox"></td></input></tr>
<tr><td><input type="checkbox" name="checkbox4" class="rowSelectCheckbox"></td></input></tr>

</table>

<input type="checkbox" name="checkbox_select" id="lastCheckbox"></input>

我想要做的是设置最后一个具有 lastCheckbox id 的复选框来检查是否选中了任何其他复选框（任何具有 checkbox1、复选框 2 等 id 的复选框），否则如果所有其他复选框都未选中，也将最后一个复选框设置为未选中。

4

5 回答 5

1

一个小问题：结束</input>标签属于标签之前</td>。

否则它非常简单。

$(".rowSelectCheckbox").click(function(){
    var lastCheckbox = $("#lastCheckbox");
    if $(".rowSelectCheckbox:checked").length) {
        lastCheckbox.attr("checked", "checked");
    } else {
        lastCheckbox.removeAttr("checked");
    }
});
于 2011-09-04T00:02:38.810 回答
0

试试这个：

$('.rowSelectCheckbox').change( function() {
    $('.rowSelectCheckbox').each( function() {
        if ($(this).prop('checked')) {
            $('#lastCheckbox').prop('checked', true);
            return false;
        }

        $('#lastCheckbox').prop('checked', false);
    } );
} );

小提琴：http: //jsfiddle.net/B78vP/

于 2011-09-03T23:55:06.137 回答
0

你应该这样做：

$('.rowSelectCheckbox').change( function() {
    flag = false;
    $('.rowSelectCheckbox').each( function() {
        if ($(this).is(':checked')) {
            flag = true;
        }
    });    
    $('#lastCheckbox').prop('checked', flag);
});

现场演示：http: //jsfiddle.net/nayish/teXHe/

于 2011-09-03T23:59:09.370 回答
0

一个快速的 if 测试应该这样做：

$("input.rowSelectCheckbox").change(function(){
    if ( $("input.rowSelectCheckbox:checked") ) { //include "rowSelectCheckbox" so id=lastCheckbox doesn't trip the test
        $("input#lastCheckbox").attr("checked");
    }
    else
        $("input#lastCheckbox").removeAttr("checked");
    }
});

循环，例如 .each()，是不必要的，因为您只关心是否检查了（任何）一个input.rowSelectCheckbox。这将在第一次遇到<input class="rowSelectCheckbox" />被检查的时返回 true ;)

于 2011-09-04T00:02:05.090 回答
0

下面的 jQuery 应该可以解决问题

$(document).ready(function() {
    $(".rowSelectCheckbox").click(function() {
        var numChecked = $(".rowSelectCheckbox").filter(":checked").length;

        if(numChecked > 0)
        {
            $("#lastCheckbox").prop("checked", "checked");
        }
        else
        {
            $("#lastCheckbox").prop("checked", false);
        }
    });
});

当其中任何一个被单击时，这将计算选中的复选框的数量，如果此数字大于 0，则选中表格外的最后一个复选框。

这里有一个工作示例。

于 2011-09-04T00:02:08.393 回答