Question

我有一个简单的按钮，可以从json对象中删除一个项目。这目前工作正常。我遇到的问题是，一旦它被点击，一旦由于js错误它再次不起作用。错误是报告项目为空。

我认为delete会删除json项，而不是简单地将其标记为null。

请参阅此JSFiddle

$("button").click(function() {
  var jsonObj = $.parseJSON($('div').text());

  var name;

  if($(this).attr('id') == 'btn1') name = 'John2';
  if($(this).attr('id') == 'btn2') name = 'Anna';

  $.each(jsonObj, function(i, obj) {
    if (obj.firstName == 'Anna') delete jsonObj[i];
  });

  $('div').text(JSON.stringify(jsonObj));
});

我需要从div中获取json文本，从中删除一个项目，然后将其作为文本保存回div。任何帮助将不胜感激。

Answer 1

你应该迭代对象的.employees数组元素
您无法使用delete从数组中删除元素 - 请改用.splice。
一旦匹配完成后你应该从return false回调$.each，或者你最终会迭代不存在的元素 - 修改大小时你必须要小心一个集合，同时迭代它。

请参阅https://jsfiddle.net/alnitak/mjw4z7jL/1/

Answer 2

原因是您在循环键时从数组中删除项目。当你删除一个项目时，它会重新排列其他项目，具体取决于数组在内部的实现方式，最终你会得到一个不会迭代你期望的键的循环。一旦进入状态，请使用for循环代替$.each或return false。

 $("button").click(function() {
  var jsonObj = $.parseJSON($('div').text());

  var name;

  if($(this).attr('id') == 'btn1') name = 'John2';
  if($(this).attr('id') == 'btn2') name = 'Anna';
  for(i=0; i < jsonObj.employees.length; i++){
   if (jsonObj.employees[i].firstName == name){
        jsonObj.employees.splice(i,1);
    } 
  }

  $('div').text(JSON.stringify(jsonObj));
});

https://jsfiddle.net/bipen/715qkhwo/4/

提醒您，这不是一个合适的解决方案，完全取决于您的json对象。如果有两个具有相同firstName的对象，这可能会给你带来奇怪的结果。因此，请确保在删除之前添加所有必需的条件。

Answer 3

您正在遍历根对象，它有一个属性，员工

您需要遍历object.employees数组

使用本机数组过滤功能

更容易

注意：这将处理多个Johns和Annas而没有问题

$("button").click(function() {
  var jsonObj = $.parseJSON($('div').text());

  var name;

  if(this.id == 'btn1') name = 'John2';
  else if(this.id == 'btn2') name = 'Anna';
  else return;
  jsonObj.employees = jsonObj.employees.filter(function(emp) {
    return emp.firstName != name;
  })
  $('div').text(JSON.stringify(jsonObj));
});

https://jsfiddle.net/715qkhwo/5/

删除json项会导致错误

3 个答案: