与一大堆示例进行比较,并且仍然是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,所以应该使用如下所示的onclick处理程序。
$(':checkBox[name=selectAll]').click (function () { $(':checkBox[name=domainList]').prop('checked',this.checked); });
请注意,上面的代码将查看整个dom的name = selectAll的复选框,并设置复选框的状态为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>