2012-11-21 177 views
1

我有這個JSON數據從我的web服務回來。如何循環每行並追加到<ul>Jquery解析JSON數據

我已經得到了下面的代碼,但它似乎不工作。謝謝。

<script type="text/javascript"> 
     $(document).ready(function() { 
      $('a#pop-video-link').click(function(e){ 
       // window.alert("test"); 
       var htm = ""; 
       // htm = $('ul.ad-thumb-list').html(htm); 
       $("ul.ad-thumb-list li").remove(); 
       e.preventDefault(); 
       var src = $(this).attr('title'); 
       getResults(src); 

      function getResults(str) { 
       $.ajax({ 
         type: "POST", 
         async: false, 
         contentType: "application/x-www-form-urlencoded", 
         dataType: "json", 
         data: 'data=' + str, 
         url: '/base/MyApi/MyPostFunction', 
         success: function(data){ 
         var myData = JSON.parse(jsonString2); 
         var $grouplist = $('#groups'); 
         $.each(myData, function() { 
          $('<li><a href="'+ this.url +'"/><img src="'+ this.src + '" class="image0"/></li>').appendTo($grouplist); 
         }); 
         } 
       }); 
         } 
      }); 
      }); 
      </script> 

JSON數據試圖解析:

<value>[{"url":"/media/22.jpg","src":"/media/429.jpg"},{"url":"/media/44.jpg","src":"/media/55.jpg"},{"url":"/media/22.jpg","src":"/media/33.jpg"}]</value> 

回答

1

你有第一個對象的single dimensional array of objects so data[0].id would have id,你還需要使用長度就可以了,而不是計數。

for (var i = 0; i < data.length; i++) { 
     var n = data[i]; 
     $('ul.ad-thumb-list').append('<li><a href="'+n.url+'"/><img src="'n.src+'" class="image0"/></li>'); 
} 
0

您可以通過從數據的所有對象[0] $.each

$.each(data[0], function(key, val) { 
    $('<li><a href="'+ key +'"/><img src="'+ val +'" class="image0"/></li>') 
     .appendTo('ul.ad-thumb-list'); 
}); 

遍歷看是否能解決您的問題。

+0

感謝您的回覆。我發現這似乎工作正常: var myData = JSON.parse(jsonString); $(文件)。就緒(函數(){ 變量$ GROUPLIST = $( '#組'); $。每個(myData的,函數(){ $(」

  • '+ this.url +'
  • ').appendTo($ grouplist); }); }); – PeteTheGreek