Javascript jQuery-复选框选择一行中的所有内容或具有类似名称&；ID'；s

使用jquery1.9.1&获取从需要在网页中显示的查询返回的XML，如下图所示。几天前我曾问过一个类似的问题，但我所问的问题完全是胡说八道。希望这次能提出更好的问题

对于图片中的项目，XML输入为：

<Classrooms>
    <Room Number="3">
        <Machine>310</Machine>
        <Machine>320</Machine>
        <Machine>340</Machine>
        <Machine>350</Machine>
    </Room>
    <Room Number="8">
        <Machine>810</Machine>
        <Machine>820</Machine>
        <Machine>840</Machine>
    </Room>
    <Room Number="10">
        <Machine>1010</Machine>
        <Machine>1020</Machine>
    </Room>
</Classrooms>

当在数据上运行上述代码时，表中的

HTML

如下所示

<tbody>
   <tr>
     <td>
       <input name="Room3" id="Room3" class="checkall" type="checkbox" />
       <label for="Room3">Room 3</label>
     </td>
     <td>
       <input name="Room3Mach310" id="Room3Mach310" type="checkbox" />
       <label for="Room3Mach310">310</label>
     </td>
     <td>
       <input name="Room3Mach320" id="Room3Mach320" type="checkbox" />
       <label for="Room3Mach320">320</label>
     </td>
     <td>
       <input name="Room3Mach340" id="Room3Mach340" type="checkbox" />
       <label for="Room3Mach340">340</label>
     </td>
     <td>
       <input name="Room3Mach350" id="Room3Mach350" type="checkbox" />
       <label for="Room3Mach350">350</label>
     </td>
   </tr>
   <tr>
     <td>
       <input name="Room8" id="Room8" class="checkall" type="checkbox" />
       <label for="Room8">Room 8</label>
     </td>
     <td>
       <input name="Room8Mach810" id="Room8Mach810" type="checkbox" />
       <label for="Room8Mach810">810</label>
     </td>
     <td>
       <input name="Room8Mach820" id="Room8Mach820" type="checkbox" />
       <label for="Room8Mach820">820</label>
     </td>
     <td>
       <input name="Room8Mach840" id="Room8Mach840" type="checkbox" />
       <label for="Room8Mach840">840</label>
     </td>
   </tr>
   <tr>
     <td>
       <input name="Room10" id="Room10" class="checkall" type="checkbox" />
       <label for="Room10">Room 10</label>
     </td>
     <td>
       <input name="Room10Mach1010" id="Room10Mach1010" type="checkbox" />
       <label for="Room10Mach1010">1010</label>
     </td>
     <td>
       <input name="Room10Mach1020" id="Room10Mach1020" type="checkbox" />
       <label for="Room10Mach1020">1020</label>
     </td>
   </tr>
</tbody>

我确信这是我忽略的东西，但我错过了什么？如果有任何关于我做错了什么的建议或指导，或者是否有更好的方法来做我正在做的事情，我将不胜感激

---

谢谢

你可以这样做

$('.checkall').change(function(){
   $('input[id^='+this.id+']').prop('checked',this.checked);
});

单击

.checkall

时/更改-在id以当前单击元素开始的所有输入上设置checked属性

id

虽然您可能应该委托，因为您使用ajax来获取元素-这是假设在DOM Ready上存在

#mytable

，或者替换为一个这样做的祖先元素

$('#mytable').on('click','.checkall',function(){
     $('input[id^='+this.id+']').prop('checked',this.checked);
});

另一种选择是将checkall id作为类提供给相关复选框

$tr.append('<td><input type="checkbox" name="'+idname+'" id="'+idname+'" class="'+roomchk+'"/><label for="'+idname+'">'+machID+'</td>');

---

你有一个很好的问题，OP，但它隐藏在许多冗长的文字中，你能为我们拼凑一个JSFIDLE吗？另外，它可以帮助你指出，你只想找出如何创建复选框的细节。据我所知，您只需要一个复选框列表，其中所有复选框都有一个主复选框，用于“选择/取消选择所有”功能。对吗？你误用了ID，你肯定想要类。您基本上希望对机器执行类似的操作，然后检查一个房间中的所有机器，它只是$（'.room'）。单击（function（）{$（'.+$（this）.data（'number'））.prop（'checked'，this.checked）；}）；谢谢-我使用了您的上一个示例（将checkall id作为类分配给相对复选框），它适用于我的示例。谢谢你的帮助！

$('#mytable').on('click','.checkall',function(){
     $('input[id^='+this.id+']').prop('checked',this.checked);
});

$tr.append('<td><input type="checkbox" name="'+idname+'" id="'+idname+'" class="'+roomchk+'"/><label for="'+idname+'">'+machID+'</td>');

$('#mytable').on('click','.checkall',function(){
     $('input.'+this.id).prop('checked',this.checked);
});