如何使用 jquery $this 从列表中删除特定的 object？

Question

我有一些带有复选框的表格，单击它们后，我想添加/删除它们的数据以列为 object。 我确实已经将 object 添加到列表中，但我正在努力删除我点击的 object。

   var myList = [];

    $('.addMe').click(function() {
        var tr = $(this).parent('td').parent('tr');
        var id = $(tr).children('.col-id').text();
        var zxc = $(tr).children('.col-zxc').text();

        if ($(this).hasClass('added')){
            **myList.filter(function(value){
                return value.id !== id;
            });**
            console.log('removing: '+id);
        }
        else{
            myList.push({id,zxc});
            console.log('adding: '+id);
        }

        console.log(myList);
      });

这部分不起作用：

myList.filter(function(value){
                    return value.id !== id;
                });

因此，当我添加 4 个元素时：

myList = [ {id:'1', zxc:'test'}, {id:'2', zxc:'test1'}, {id:'3', zxc:'test2'}, {id:'4', zxc:'test3'}]

我想删除例如点击第三个复选框的第三个元素，结果将是：

myList = [ {id:'1', zxc:'test'}, {id:'2', zxc:'test1'}, {id:'4', zxc:'test3'}]

我尝试使用 filter()、grep() 但我无法使其工作。

这是带有完整代码的 jsfiddle 及其工作原理：https://jsfiddle.net/1rm6pwqk/

Answer 1

filter 方法不会改变调用它的数组。 相反，它返回一个新数组，其中包含满足谓词的元素。 将返回值分配给您的 myList 变量以更新它：

myList = myList.filter(function(value){
                return value.id !== id;
            });