在由多个xml文件提供的列表视图中加载多个图像时遇到困难

Question

我正在为Android开发一个html应用程序，我试图在列表视图中加载图像。特定于列表项的数据由多个xml文件提供。我使用ajax来加载xml文件并填充列表项。我在这里面临的问题是有164个列表项目。因此，需要加载164个图像和10个xml文件。我的加载函数在两次迭代后耗尽。它确实读取了xml文件，但它无法动态创建列表项并在两次迭代后用图像填充它们。我相信这是由于堆栈限制。我想不出替代解决方案。如果有人可以建议备用解决方案，将高度赞赏。以下是我的加载函数。这是一个递归函数：

function loadChannels() { 

     $.ajax({ 
      type: "GET", 
      url: curURL, 
      dataType: "xml", 
      error: function(){ console.log('Error Loading Channel XML'); }, 
      success: function(nXml) { 
       var noOfItems = parseInt($($(nXml).find('total_items')[0]).text(), 10); 
       var startIdx = parseInt($($(nXml).find('item_startidx')[0]).text(), 10); 

       var allItems = $(nXml).find('item'); 


       $(allItems).each(function() { 
        var obj = $("<li><span id='cont-thumb'></span><span id='cont-name'></span></li>"); 
        $("#content-scroller ul").append($(obj)); 

        var imgURL = $($(this).find('item_image')[0]).text(); 
        var contThumb = $(obj).children()[0]; 
        $(contThumb).css("background-image", 'url('+imgURL+')'); 
        var name = $($(this).find('name')[0]).text(); 
        var contName = $(obj).children()[1]; 
        $(contName).text(name).css('text-align', 'center'); 
        var url = $($(this).find('link')[0]).text(); 
        $(obj).data('item_link', url); 
        $(obj).bind('click', onJPContSelected);     
       }); 

       if(startIdx+allItems.length < noOfItems){ 

        var newIdx = new Number(startIdx+allItems.length); 
        var tokens = curURL.split("/"); 
        tokens[tokens.length-2] = newIdx.toString(10); 
        curURL = "http:/"; 
        for(var i=2; i<tokens.length; i++) 
         curURL = curURL + "/" + tokens[i]; 

        loadChannels(); 
       } 
      } 
     }); 
    } 

Answer 1

尝试与外环删除递归 - 类似的东西：

function loadChannels(){ 
    var stopFlag = false; 
    // request the pages one after another till done 
    while(!stopFlag) 
    { 
     $.ajax({ 
      type: "GET", 
      url: curURL, 
      dataType: "xml", 
      error: function(){ 
       console.log('Error Loading Channel XML'); 
       errorFlaf = true; 
      }, 
      success: function(nXml) { 
       var noOfItems = parseInt($($(nXml).find('total_items')[0]).text(), 10); 
       var startIdx = parseInt($($(nXml).find('item_startidx')[0]).text(), 10); 
       var allItems = $(nXml).find('item'); 
       $(allItems).each(function() { 
        var obj = $("<li><span id='cont-thumb'></span><span id='cont-name'></span></li>"); 
        $("#content-scroller ul").append($(obj)); 

        var imgURL = $($(this).find('item_image')[0]).text(); 
        var contThumb = $(obj).children()[0]; 
        $(contThumb).css("background-image", 'url('+imgURL+')'); 
        var name = $($(this).find('name')[0]).text(); 
        var contName = $(obj).children()[1]; 
        $(contName).text(name).css('text-align', 'center'); 
        var url = $($(this).find('link')[0]).text(); 
        $(obj).data('item_link', url); 
        $(obj).bind('click', onJPContSelected);     
       }); 

       if(startIdx+allItems.length < noOfItems){ 

        var newIdx = new Number(startIdx+allItems.length); 
        var tokens = curURL.split("/"); 
        tokens[tokens.length-2] = newIdx.toString(10); 
        curURL = "http:/"; 
        for(var i=2; i<tokens.length; i++) 
         curURL = curURL + "/" + tokens[i]; 

        // lets disable the recursion 
        // loadChannels(); 
       } 
       else { 
        stopFlag = true; 
       } 
      } 
     });   
    } 
}