Javascript 在内容更新时保留复选框值

我已经为这个问题挣扎了一段时间了。也许你能帮忙

我有一个表格，每行开头都有一个复选框。我定义了一个函数，它定期重新加载表。它在生成新表的JSP上使用jQuery的load（）函数

问题是，我需要保留复选框值，直到用户决定要选择哪些项目。当前，它们的值在更新之间丢失

我目前使用的试图修复它的代码是：

 refreshId = setInterval(function()
 {
        var allTicks = new Array();
        $('#myTable input:checked').each(function() {
            allTicks.push($(this).attr('id'));
        });
        $('#myTable').load('/get-table.jsp', null,
                function (responseText,textStatus, req ){
            $('#my-table').tablesorter();
            //alert(allTicks + ' length ' + allTicks.length);
            for (i = 0 ; i < allTicks.length; i++ )
                $("#my-table input#" + allTicks[i]).attr('checked', true);

        });
}, $refreshInterval); 

还对数组的内容进行了以前的检查，它包含所有正确的条目

DOM更改或使用全新的表实例是否会导致这种情况

EDIT2:

以下是JSP生成的表示例（出于保密目的编辑）：

全名
IP地址
角色
工作时间
地位
管理层
头
10.20.1.14
H
4.
在…上
永久的
旅社2
10.20.1.7
C
4.
开始
动态
旅社3
10.20.1.9
C
4.
开始
动态
旅社4
10.20.1.11
C
4.
开始
动态

---

请注意，复选框的id和名称与主机名一致。还要注意，第一个td没有复选框。这是预期的行为。

更改“特殊”属性，如

disbaled

或

checked

，应该这样做：

$(...).attr('checked','checked');

或者，如果您使用的是jQuery 1.6或更高版本：

$(...).prop('checked', true);  // more reliable

请参见jQUery文档中关于和的内容

下面是经过一些优化修改的代码（请查看注释）：

refreshId=setInterval（函数（）
{
var allTicks=[]，
$myTable=$（'#myTable'）；//选择一次并重复使用
//.map（）返回一个数组，该数组就是您要查找的数组
//也不要这样做：$（this.attr（'id'）。
//“id”是javascript和
//在.map（）和.each（）中，“this”是当前的domeElement，因此只需执行以下操作：
//这是我的身份证
allTicks=$myTable.find（'input:checked'）.map（函数（）{return this.id；}）；
$myTable.load（'/get table.jsp'，null，函数（responseText，textStatus，req）{
$myTable.tablesorter（）；
//警报（allTicks+长度+allTicks.length）；
对于（i=0；i

更改“特殊”属性，如

已解除锁定

或

已选中

应按以下方式进行：

$(...).attr('checked','checked');

或者，如果您使用的是jQuery 1.6或更高版本：

$(...).prop('checked', true);  // more reliable

请参见jQUery文档中关于和的内容

下面是经过一些优化修改的代码（请查看注释）：

refreshId=setInterval（函数（）
{
var allTicks=[]，
$myTable=$（'#myTable'）；//选择一次并重复使用
//.map（）返回一个数组，该数组就是您要查找的数组
//也不要这样做：$（this.attr（'id'）。
//“id”是javascript和
//在.map（）和.each（）中，“this”是当前的domeElement，因此只需执行以下操作：
//这是我的身份证
allTicks=$myTable.find（'input:checked'）.map（函数（）{return this.id；}）；
$myTable.load（'/get table.jsp'，null，函数（responseText，textStatus，req）{
$myTable.tablesorter（）；
//警报（allTicks+长度+allTicks.length）；
对于（i=0；i

让我们假设JavaScript确实检索并设置了复选框。 那么异步Ajax调用仍然存在问题。 首先，尝试使用非常大的刷新间隔

将for循环放在tablesorter调用之前

不要设置Interval，而是设置Timeout，并将其安排为一次。 然后在加载函数中安排下一次。 这可以防止可能导致错误的重复调用

---

但在未调用加载时，可能会停止刷新。（不太重要。）

让我们假设JavaScript确实检索并设置复选框。 那么异步Ajax调用仍然存在问题。 首先，尝试使用非常大的刷新间隔

将for循环放在tablesorter调用之前

不要设置Interval，而是设置Timeout，并将其安排为一次。 然后在加载函数中安排下一次。 这可以防止可能导致错误的重复调用

---

但在未调用加载时，可能会停止刷新。（不太重要。）

在痛苦地挖掘了很多小细节之后，我意识到我的问题不是如何编码，也不是意外的DOM更改，而是一个我没有看到的简单细节：

我试图分配给复选框的id包含句点（“.”）字符。

这导致jQuery在尝试查找这种id时出现很多问题，因为句点as is充当类描述符。为了避免这种情况，必须使用2个反斜杠转义句点字符

例如：

$("#my.id")    // incorrect
$("#my\\.id")  // correct

那么在我的情况下，解决办法是：

$myTable.find('#' + allTicks[i].replace(".", "\\.")).prop('checked', true);

。。。它终于起作用了

---

谢谢大家的帮助

在花了好几个小时痛苦地挖掘每一个小细节之后，我意识到我的问题不是如何编码，也不是

$("#my.id")    // incorrect
$("#my\\.id")  // correct

$myTable.find('#' + allTicks[i].replace(".", "\\.")).prop('checked', true);