如何使用JQuery来解析这个json?

时间:2012-09-15 02:04:26

标签: javascript jquery json

我有这个JSON:

{
  "jsonDept": [
    {
      "Id": "1",
      "DeptName": "aaaa "
    }, {
      "Id": "2",
      "DeptName": "bbb "
    }, {
      "Id": "6",
      "DeptName": "ccc "
    }, {
      "Id": "7",
      "DeptName": "ddd "
    }, {
      "Id": "8",
      "DeptName": "eee "
    }, {
      "Id": "9",
      "DeptName": "fff "
    }, {
      "Id": "12",
      "DeptName": "haha "
    }, {
      "Id": "13",
      "DeptName": "test1 "
    }, {
      "Id": "14",
      "DeptName": "test2 "
    }, {
      "Id": "10",
      "DeptName": "tmd "
    }, {
      "Id": "11",
      "DeptName": "tnnd "
    }
  ]
}

我的JQuery:

function loadDepartmentList() {
    $.ajax({
        url: "QueryDepartment.ashx",
        //data: "",
        type: "GET",
        dataType: 'json',
        success: function (data) {
            // how to read json here? this is not working
            $.each(data, function () {
                alert("Name: " + this.DeptName);
            });
        }
    })
}

但警报显示“未定义”,只弹出一次。

我想要做的是解析这个json,并生成html <ul><li>DeptName</li></ul>并将html放入div中。

我用Google搜索了许多代码,但它们无法正常工作。我认为这可能是开头字符串“jsonDept”的问题。

任何人都可以为这个json写一个工作脚本吗?谢谢!

2 个答案:

答案 0 :(得分:4)

返回的对象包含一个属性,即jsonDept。它是jsonDept属性,包含部门信息数组。

function loadDepartmentList() {
    $.ajax({
        url: "QueryDepartment.ashx",
        //data: "",
        type: "GET",
        dataType: 'json',
        success: function (data) {
            // how to read json here? this is not working
            $.each(data.jsonDept, function () {
                alert("Name: " + this.DeptName);
            });
        }
    })
}

答案 1 :(得分:0)

这是否要将json数组解析为HTML列表“ul li DeptName / li / ul”?

为UL创建ID

<ul id="list"></ul>

功能:

     function loadDepartmentList() {
       $.ajax({
          url: "QueryDepartment.ashx",
           //data: "",
           type: "GET",
           dataType: 'json',
           success: function (data) {            
           $.each(data.jsonDept, function () {
              $('#lsit').append('<li>'+this.DeptName+'</li>');
           });
        }
    })
  }

希望这会给出一些想法..