对象数组:无法读取onchange事件中未定义的属性'id'

时间:2018-07-01 09:43:39

标签: javascript jquery arrays checkbox

我一直在寻找一种方法,如果id变量等于对象的id,则从对象数组中删除单个对象。

我使用数组来知道选中了哪些复选框,以便收集相关信息以进行进一步处理。

示例:https://jsbin.com/vicerewevi/edit?html,js,output

快速选择复选框时出现错误:

Uncaught TypeError: Cannot read property 'id' of undefined
    at vicerewevi.js:33
    at Function.each (jquery-3.1.0.js:368)
    at HTMLInputElement.<anonymous> (vicerewevi.js:32)
    at HTMLInputElement.dispatch (jquery-3.1.0.js:5110)
    at HTMLInputElement.elemData.handle (jquery-3.1.0.js:4918)
如果value.id == id:

// if checkbox is checked, add object to array and if unchecked remove object by 'id' from array
$('.checkbox').change( function(){

    var id = parseInt($(this).attr('data-id'))
    var foo = $(this).parent().siblings().find('#foo').val()
    var bar = $(this).parent().siblings().find('#bar').val()

    if($(this).prop('checked')) {
        var obj = {'id': id, 'foo': foo, 'bar': bar}
        jsonobjects.push(obj)
    } else {
        $.each(jsonobjects, function( index, value ) {
            if (value.id == id ) {
                jsonobjects.delete(index)
            }
        });
    }
    countChecked() // update count of checkboxes
    console.log(JSON.stringify(jsonobjects))
  $('#output').html(JSON.stringify(jsonobjects, null, ""))
});

我在下面尝试的SO上找到了以下代码(以前从未使用过自定义原型):

Array.prototype.delete = function(pos){
    this[pos] = undefined;
    var len = this.length - 1;
    for(var a = pos;a < this.length - 1;a++){
      this[a] = this[a+1];
    }
    this.pop();
  }

4 个答案:

答案 0 :(得分:2)

由于您从数组中/Users/[your-user-name]/.composer/vendor/bin个条目,下次您对其进行迭代时,将得到一个delete,即value,用于数组中的特定“间隙”。显然,它没有undefined属性。

要解决此问题,请不要使用id,而要使用delete创建一个新的,经过过滤的数组,该数组将不会出现这种间隙。

替换:

filter

...具有:

    $.each(jsonobjects, function( index, value ) {
        if (value.id == id ) {
            jsonobjects.delete(index)
        }
    });

或者,如果您想使用jQuery方法,请使用 jsonobjects = jsonobjects.filter(function( value ) { return value.id !== id; });

$.grep

答案 1 :(得分:2)

  

我正在寻找一种方法,如果id变量等于对象的id,则从对象数组中删除单个对象。

$(MAKE) MODE=1

答案 2 :(得分:2)

充分利用Array.filter方法并将jsonobjects重新分配给过滤后的数组,就像这样,而不是您创建的delete方法

jsonObjects = jsonObjects.filter((value, index) => { return value.id !== id; }) 希望对您有帮助

答案 3 :(得分:0)

当我尝试在该遮篷For..In loops in JavaScript - key value pairs上尝试解决方案时,这对我有用

for (var k in jsonobjects){
    if (jsonobjects.hasOwnProperty(k)) {
        if (jsonobjects[k].id == id) {
            jsonobjects.splice(k, 1)
        }
    }
}