Javascript 分离JSON数组_Javascript_Jquery_Html_Json

Javascript 分离JSON数组

javascript jquery html json

Javascript 分离JSON数组,javascript,jquery,html,json,Javascript,Jquery,Html,Json,我有一个JSON数组，其中包含大量的人员数据，每个数据的类型都像“hr”或“accounting” JSON数组如下所示： { "0": { "id": "2", "name": "blabla", "type": "hr" }, "1": { "id": "3", "name": "bub", "type": "hr" }, "2": { "i

我有一个JSON数组，其中包含大量的

人员

数据，每个数据的类型都像

“hr”

或

“accounting”

JSON数组如下所示：

{
    "0": {
        "id": "2",
        "name": "blabla",
        "type": "hr"
    },
    "1": {
        "id": "3",
        "name": "bub",
        "type": "hr"
    },
    "2": {
        "id": "4",
        "name": "ula",
        "type": "accounting"
    },
    "3": {
        ...
    }
}

<ul>
   <li><p>hr</p>name: blabla<p></li>
   <li><p>hr</p>name: bub<p></li>
   <li><p>hr</p>......</li>
</ul>
<ul>
   <li><p>accounting</p>name: ula<p></li>
   <li><p>accounting</p>......</li>
</ul>

我想在

ul

中显示它们，如下所示：

{
    "0": {
        "id": "2",
        "name": "blabla",
        "type": "hr"
    },
    "1": {
        "id": "3",
        "name": "bub",
        "type": "hr"
    },
    "2": {
        "id": "4",
        "name": "ula",
        "type": "accounting"
    },
    "3": {
        ...
    }
}

<ul>
   <li><p>hr</p>name: blabla<p></li>
   <li><p>hr</p>name: bub<p></li>
   <li><p>hr</p>......</li>
</ul>
<ul>
   <li><p>accounting</p>name: ula<p></li>
   <li><p>accounting</p>......</li>
</ul>


hr
姓名：布拉布拉
hr
名称：bub
人力资源


会计
名称：ula
会计

但我不知道如何分离JSON数组，也不知道如何正确地循环显示它。

这基本上可以满足一个部门的需求。您可以通过在每个循环中放入if并对照value.type检查来为每个部门使用它

var new_html = "<ul>";
$.each('name_of_json_array', function(key, value){
    new_html+="<li><p>"+value.type+"</p><p>name: "+value.name+"</p></li>";
});
new_html+="</ul>";
$('#some_container_element').append(new_html);

var new_html=“”；
$.each（'name_of_json_array'，函数（键，值）{
新的html+=“”+value.type+”
名称：“+value.name+”
”；
});
新的html+=“”；
$（“#某些_容器_元素”）.append（新的_html）；

试试这个：

<!DOCTYPE html>
<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    </head>
    <body>
        <div class="container"></div>
        <script>
        var json={
            "0": {
                "id": "2",
                "name": "blabla",
                "type": "hr"
            },
            "1": {
                "id": "3",
                "name": "bub",
                "type": "hr"
            },
            "2": {
                "id": "4",
                "name": "ula",
                "type": "accounting"
            }
        };

        var previous_type=json[0].type;
        var _html="<ul>";

        $.each(json, function(index,key) {
            if (previous_type!=key.type) {
                _html+="</ul><ul>";
            }
            previous_type=key.type;
            _html+="<li><p>"+key.type+"</p><p>name: "+key.name+"</p></li>";
        });
        _html+="</ul>";
        $('.container').html(_html);
        </script>
    </body>
</html>

那不是一个数组…那是一个对象。到目前为止你考虑/尝试了什么？你用什么来理解Javascript？谢谢dave的工作很有魅力。。。几乎和我拥有的一样，但我错过了if循环中最重要的部分。。。两个砰砰地从我身上跳了起来