带有jQuery的多级JSON

时间:2013-06-04 13:44:11

标签: javascript jquery html json parsing

我正在尝试创建一些深层次的json,我在2个地方遇到了麻烦。第一,是格式正确。我还想在数据集中添加“level_two”。

第二个是解析数据。任何帮助将不胜感激。

谢谢!

JSON:
{
    "math_problems": [
        {
            "level_one": {
                "addition": {
                   "problem": {
                        "data_set": [
                            3,
                            2
                        ]
                    },
                    "problem": {
                        "data_set": [
                            5,
                            1
                        ]
                    }
                },
                "subtraction": {
                    "problem": {
                        "data_set": [
                            4,
                            2
                        ]
                    }
                },
                "division": {
                    "problem": {
                        "data_set": [
                            3,
                            2
                        ]
                    }
                },
                "multiplication": {
                    "problem": {
                        "data_set": [
                            3,
                            2
                        ]
                    }
                }
            }
        }
    ]
}


jQuery:

$.getJSON('/data/math.json', function(data) {

        var the_data = [];

        $.each(data,function(index,item) {
            i = index;
            number_one = item[0]['level_one']['addition']['problem']['data_set'][0];
            number_two = item[0]['level_one']['addition']['problem']['data_set'][1];

            the_data += number_one + " + " + number_two;
        });

        $('<ul/>', {
            'class': 'my-new-list',
            html: the_data + " = " + (number_one + number_two)
        }).appendTo('body');
    });

我希望能够解析数据以便说出:

level_one&gt;添加&gt;问题1&gt; 3,2

level_two&gt;减法&gt;问题1&gt; 4,3

有什么想法吗?

3 个答案:

答案 0 :(得分:2)

问题是,您在同一级别的哈希中定义了相同的密钥:

"problem": {
    "data_set": [
        3,
        2
    ]
},
"problem": {
    "data_set": [
        5,
        1
    ]
}

这些会相互碰撞和覆盖。将它重组为一个数组,你应该很好。

答案 1 :(得分:1)

所以正确的JSON是:

var object = {
    levelOne: {
        // etc.
    },
    levelTwo: {
        // etc.
    }
}

使用JSON.parse()解析它,然后遍历它就像:

object.level_one.prop.prop1;
object.level_two.otherProp.otherProp2;

答案 2 :(得分:0)

JSON被转换为javascript对象,因此你在“添加”上重复键“问题”的事实使第二个“问题”覆盖了第一个。

你应该重新考虑你的json结构,可能是这样的:

"math_problems" : {
  "level_one": {
    "addition": {
      "problems": [
        {
          "data_set": [3,2]
        },
        {
          "data_set": [5,1]
        }
      ]
    },
    "subtraction": ...     
  }  
}

或者,如果问题,问题类型和级别是高度动态的:

"math_problems" : {    
  "levels": [
    {
      "name" : "Level one",
      "problems": [
        {
          "type" : "addition",
          "data_set": [3,2]
        },
        {
          "type" : "addition",
          "data_set": [5,1]
        },
        {
          "type" : "subtraction",
          "data_set": [2,1]
        }
      ]
    },
    {
      "name" : "Level two",
      "problems": [
        ...
      ]
    }
  ]
}