1

使用 jQuery 1.9.1，同时使用 IE8 和 Firefox。在我的页面上，我有一个表格，其中包含动态创建的复选框。

显示时，几行的 HTML 如下所示：

<tr><td><label for="RoomNbr2" align="right">&nbsp;&nbsp;Room No 2<input type="checkbox" align="left" class="checkall" id="RoomNbr2" name="RoomNbr2"></label></td><td><label for="PCNbr203" align="right">&nbsp;&nbsp;203<input type="checkbox" align="left" id="PCNbr203" name="PCNbr203" class="RoomNbr2"></label></td><td><label for="PCNbr204" align="right">&nbsp;&nbsp;204<input type="checkbox" align="left" id="PCNbr204" name="PCNbr204" class="RoomNbr2"></label></td></tr>
<tr><td><label for="RoomNbr3" align="right">&nbsp;&nbsp;Room No 3<input type="checkbox" align="left" class="checkall" id="RoomNbr3" name="RoomNbr3"></label></td><td><label for="PCNbr310" align="right">&nbsp;&nbsp;310<input type="checkbox" align="left" id="PCNbr310" name="PCNbr310" class="RoomNbr3"></label></td><td><label for="PCNbr320" align="right">&nbsp;&nbsp;320<input type="checkbox" align="left" id="PCNbr320" name="PCNbr320" class="RoomNbr3"></label></td><td><label for="PCNbr340" align="right">&nbsp;&nbsp;340<input type="checkbox" align="left" id="PCNbr340" name="PCNbr340" class="RoomNbr3"></label></td><td><label for="PCNbr350" align="right">&nbsp;&nbsp;350<input type="checkbox" align="left" id="PCNbr350" name="PCNbr350" class="RoomNbr3"></label></td></tr>

当用户点击一个房间时，所有与该房间相关的复选框（PCNbrXXX）都会被选中。用户还可以选择单个复选框，或者他们可以选择/取消选择单个复选框。

我注意到的是，如果我检查 Room Nbr，它会检查所有相关的复选框，但如果我单独取消选择它们，Room Nbr 复选框仍然处于选中状态。我用来检查所有框的代码是：

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

我用来捕获个别检查的代码是：

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

在 IE8 和 Firefox 中，我需要做的是监视是否选中了任何单个复选框并将 Room Nbr 复选框的显示状态更改为（1）如果该行上的所有内容都被选中，则显示已选中，（2）更改为不确定如果一行上的 1 个或多个被清除，则状态（和 checkall 已清除），以及 (3) 如果行上的所有单个复选框都被清除，则显示已清除。

我为每个单独的复选框分配了一个类，该类为我提供了 Room Nbr 复选框的名称和 ID，但我不确定如何管理上述 #1 和 #3 中的状态，或者如果 #2（显示不确定状态）在 IE8 中是可能的。至少，如果行上的 1 个或多个已被清除，我想将状态切换为已检查（如果全部已检查）或清除。

我将不胜感激有关如何进行上述操作的任何建议。我正在使用以下内容来了解​​在任何给定时间检查的内容：

$("input[name*=PCNbr]:checked").map(function () {return this.name;}).get().join(",")

并认为我可以抓住我分配给他们的课程，但还没有让它正常工作。

谢谢！

4

0 回答 0