带有for..in和每个循环的Order元素

时间:2014-06-14 20:46:22

标签: javascript jquery for-loop each

我试图找出如何在for..in循环内,在另一个循环中循环订购项目,循环遍历我的订单数组以尊重。

我的数据有一个对象:

dataObj = {
    "sites":{
        "dribbble":{
            // ID = 0
            "username":"JeremDsgn"
        },
        "behance":{
            // ID = 1
            "username":"JeremDsgn"
        },
        "cinqcentpx":{
            // ID = 2
            "username":"jeremdsgn"
        }
    },
    "order":["1","2","0"]
};

实际上我在显示循环中为每个项添加了id,但是在对象中添加id会更好吗?

所以之后,我尝试用订单数组来显示我的项目。

var index = 0;

for (var site in dataObj.sites) {
    var itemList = '<li id="' + index + '">' + site + '</li>';

    $.each(dataObj.order, function(i, id) {
        console.log(i, id);
        $(itemList).appendTo('.list-social .social-wrapper');       
    });

    index++;
}

但我复制了我的网站3次,因为此时我的dataObj.sites对象上有3个元素。

那么如何才能以良好的顺序显示我的itemList?最终结果应该是:

<div class="list-social">
    <ul class="social-wrapper">
        <li id="1">behance</li>
        <li id="2">cinqcentpx</li>
        <li id="0">dribbble</li>
    </ul>
</div>

FIDDLE:http://jsfiddle.net/JeremDsgn/XhnyS/

2 个答案:

答案 0 :(得分:1)

我不是肯定你想要做什么,但也许这个小提琴有帮助? http://jsfiddle.net/XhnyS/7/

我只是将订单列表更改为网站密钥本身,然后创建了一个列表项并将其添加到找到的每个.social-wrapper中,而不是使用索引和字母数字的顺序列表。

dataObj = {
    "sites":{
        "dribbble":{
            "username":"JeremDsgn"
        },
        "behance":{
            "username":"JeremDsgn"
        },
        "cinqcentpx":{
            "username":"jeremdsgn"
        }
    },
    "order":["cinqcentpx", "behance", "dribbble"]
};

for (var i = 0; i < dataObj.order.length; i++) {
    var siteName = dataObj.order[i];
    var itemList = $('<li/>').attr('id', i).text(siteName + ': ' + dataObj.sites[siteName].username);
    $(itemList).appendTo('.list-social .social-wrapper');
}

编辑实际回答问题:)

答案 1 :(得分:0)

试试这个。它奏效了。

   $.each(dataObj.order, function(i, id) {
    console.log(i, id);
    var index = 0;  
    for (var site in dataObj.sites) {
       console.log(index);
        if(index==id){
          console.log("equal",id,index,site);
          var itemList = '<li id="' + index + '">' + site + '</li>';
          $(itemList).appendTo('.list-social .social-wrapper');
          break;
          }
    index++;
    }
});