2011-12-08 47 views
1

JSON:分离第一个json元素并追加到不同的div?

{ 
    "storeList":{ 
     "state":[ 
     { 
      "stateName":"Maine", 
      "store":[ 
       { 
        "storeName":"Store 1", 
        "storeID":"store1", 
        "storeURL":"http:\/\/www.sitename.com" 
       }, 
       { 
        "storeName":"Store 2", 
        "storeID":"store2", 
        "storeURL":"http:\/\/www.sitename.com" 
       }, 
       { 
        "storeName":"Store 3", 
        "storeID":"store3", 
        "storeURL":"http:\/\/www.sitename.com" 
       } 
      ] 
     }, 
     { 
      "stateName":"Connecticut", 
      "store":[ 
       { 
        "storeName":"Store 1", 
        "storeID":"store1", 
        "storeURL":"http:\/\/www.sitename.com" 
       } 
      ] 
     } 
     ] 
    } 
} 

,我的功能来呈现网页上:

$(document).ready(function() { 
        var object; 
        $.getJSON('xml/storeList.json', function(json) { 
         object = json; 
         $('#storeList').append('<ul/>') 
         $.each(object.storeList.state, function() { 
         var list = $('#storeList ul'), 
          listItem = $('<li/>'), 
          html = listItem.append($('<h3/>').text(this.stateName)); 

         $.each(this.store, function() { 
          listItem.append($('<a />').attr('href', this.storeURL).text(this.storeName)); 
         }); 

         list.append(html) 
         }); 
        }); 

        }); 

我要采取的第一个“国家”的对象,并将其添加到不同的DIV比其他人。 谢谢!我意识到json是一个数组,但我不确定json中的定位是如何工作的。

回答

0

您可以直接从$.each函数获取当前值的索引。

$.each(object.storeList.state, function(index, value) { 
    var div; 
    if(index == 0) { 
    div = $('#firstItemDiv'); 
    } else { 
    div = $('#otherItemsDiv'); 
    } 
    div.append(...); 
}); 
1

你的问题标题说要分离的第一要素。对于您可以使用拼接:

$.getJSON('xml/storeList.json', function(json) { 
     object = json; 

     var firstState = object.storeList.state.splice(0, 1)[0]; 
     //first state has been removed from the array and can be added anywhere 

     $.each(object.storeList.state, function() { 
      //each will now iterate over the remaining elements 
     }); 
    }); 

或者,如果你不想删除它,你可以使用它,然后循环使用老式的,非jQuery的剩余物品循环:

$.getJSON('xml/storeList.json', function(json) { 
     object = json; 
     var currentState; 

     var firstState = object.storeList.state[0]; 

     for(var i = 1; i < object.storeList.state.length; i++) { 
      currentState = object.storeList.state[i]; 
     }); 
    }); 
相关问题