使用从元素id的变量构建的数组，分离并附加复选框选择

Question

分离工作正常但不附加。我认为数组正在构建正确但是当再次追加时，数组是未定义的。此外，如果多次取消选中，我将不再需要向数组中添加相同的元素。

的jsfiddle：https://jsfiddle.net/ud2opLxx/4/

$(document).ready(function(){
var restoreMe = [];
 $("#studentCourses :checkbox").change(function() {

    var courseid = $(this).attr('id'),
        row = $(this).closest('tr'),
        cell = row.children('td').eq(3),
        course = cell.find('input');

    if($(this).prop("checked")) {
        //var rm = $.grep(restoreMe, function(e){ return e.courseid.to_string == courseid.to_string; });
        row.css('color', '#000000');
        restoreMe[courseid].appendTo( cell ); 
        //rm[0].courseid.appendTo( cell ); 
    } else {
        row.css('color', '#c0c0c0');
        restoreMe.push({courseid: course.detach()});
        }
});
});

Answer 1

restoreMe.push({courseid: course.detach()});在列表中添加了一个新词典，而不是词典的新词条。

将其更改为restoreMe[courseid] = course.detach();，因为它按预期工作。

Answer 2

您的代码存在一个基本问题，即restoreMe是一个数组而不是JavaScript对象。使它成为一个数组使得搜索项目很困难（你需要循环），并且还有可能进行重复的条目（因为没有检查键）。

但是，对象可以构造为键值对，使得键在整个对象中是唯一的。由于您拥有这些元素的唯一ID，因此在对象中创建条目并从中检索将更加容易。

以下是我在代码中更改的部分：

...

var restoreMe = {};

...

restoreMe[courseid].appendTo( cell ); 

...

restoreMe[courseid] = course.detach();

最后，结帐这个working fiddle。

Answer 3

我替换了数组推送，现在可以正常工作：restoreMe [courseid] = course.detach（）;