与一堆示例进行了斗争,并且对 jQuery/Javascript 仍然陌生,无法让我的代码运行(这里是我在 gsp 中的模板):
<table>
<thead>
<tr>
<th><input type="checkbox" name="selectAll" onclick="selectAll(this.checked);"/></th>
</tr>
</thead>
<tbody>
<td>
<td><input type="checkbox" name="domainList" value="${domainInstance.id}"/></td>
</tbody>
<table>
我的主 gsp 中有以下 javascript 片段,它调用模板:
function selectAll(status) {
}
如何从 selectAll 名称中选择所有复选框?
最佳答案
由于您使用的是 jQuery,因此您应该为 selectAll 使用 onclick
处理程序,如下所示。
$(':checkbox[name=selectAll]').click (function () {
$(':checkbox[name=domainList]').prop('checked', this.checked);
});
请注意,上面的代码将使用 name=selectAll
在整个 dom 中查找复选框,并使用 name=domainList
设置复选框的状态。
下面是一个稍好一点的版本,但有细微的标记更改,
$('#selectAllDomainList').click(function() {
var checkedStatus = this.checked;
$('#domainTable tbody tr').find('td:first :checkbox').each(function() {
$(this).prop('checked', checkedStatus);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<table id="domainTable">
<!-- Added ID -->
<thead>
<tr>
<th>
<!-- Added ID to below select box -->
<input type="checkbox" name="selectAll" id="selectAllDomainList" />
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="checkbox" name="domainList" value="${domainInstance.id}" />
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="domainList" value="${domainInstance.id}" />
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="domainList" value="${domainInstance.id}" />
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="domainList" value="${domainInstance.id}" />
</td>
</tr>
</tbody>
<table>
关于jQuery - 切换选择所有复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9669005/