选中一个复选框到 select 个复选框
Check one checkbox to select multiple checkboxes
我有一个 table,我希望能够选中 header 中的一个复选框到 select table 中的所有复选框。这通常应该是一件非常简单的事情,但它在这里根本行不通。当我 运行 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>
由于我使用的是 ezmark 复选框,解决方案是在脚本末尾添加 .change() ,如下所示。这将简单地将检索到的复选框的选中状态设置为等于我们最近修改的 'master' 复选框的选中状态:
$('#select-all').click(function() {
$(':checkbox').prop('checked',this.checked).change();
});
我有一个 table,我希望能够选中 header 中的一个复选框到 select table 中的所有复选框。这通常应该是一件非常简单的事情,但它在这里根本行不通。当我 运行 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>
由于我使用的是 ezmark 复选框,解决方案是在脚本末尾添加 .change() ,如下所示。这将简单地将检索到的复选框的选中状态设置为等于我们最近修改的 'master' 复选框的选中状态:
$('#select-all').click(function() {
$(':checkbox').prop('checked',this.checked).change();
});