选中一个复选框以选中多个复选框

时间:2015-01-03 23:11:46

标签: jquery checkbox

我有一个表格,我希望能够在标题中选中一个复选框来选择该表格中的所有复选框。这应该是一个非常简单的事情,但它根本就不在这里工作。当我在JSfiddle上运行示例代码时,它可以工作。在我的开发环境中运行它并检查顶部框时,如果我发出alert()它会发出警报,但仍然不会检查其余的复选框。有什么想法吗?

[JS fiddle][1]

http://jsfiddle.net/pkvLqe1d/

以下是我的开发环境中的代码:

<div class="content" id="content">
<form id="selectContent" method="post" class="grow">
<table class="static" style="width:1000px;">
    <thead>
    <tr>
        <th>
        <b>Id</b>
        </th>
        <th>
        <b>Name</b>
        </th>
        <th>
        <label><input type="checkbox" name="select-all" id="select-all" /></label>
        </th>
    </tr>
    </thead>
    <tbody>
    <?php 
    foreach($a as $b)
    {
        echo "<tr>";    
        echo "<td>$b->id</td>";
        echo "<td>$b->name</td>"; 
        echo "<td><label><input type='checkbox' name='id[]' value='".trim($b->id)."' class='round'></label></td>";
        echo "</tr>";

    }
    ?>

    </tbody>
</table>
</form>


</div>

<script>
//Listen for click on toggle checkbox
$('#select-all').click(function(event) {   
    if(this.checked) {

        // Iterate each checkbox
        $(':checkbox').each(function() {

        this.checked = true;

        });
    }
});
</script>

1 个答案:

答案 0 :(得分:0)

由于我使用ezmark复选框,解决方案是在脚本末尾添加.change(),如下所示。这将只是将检索到的复选框的已检查状态设置为与我们最近修改的“主”复选框的状态相同:

$('#select-all').click(function() {
$(':checkbox').prop('checked',this.checked).change();
});