通過XML文件循環jQuery

Question

我有點卡住了以下問題。

我有幾個標記爲XML的XML文件（每個XML由一個值標識）。我現在試圖循環這些文件並將其內容輸出到HTML。

然而，它開始循環它回調

迴路0 循環1 環2 Callback0 調用callback1 Callback2

我需要 迴路0 Callback0 循環1 調用callback1

如前我需要在某個時候控制結果。

 var allContent=["xmlfile1","xmlfile2","xmlfile3","xmlfile4"]; 
     var totalSearch = 0; 
     var countSearch = 0; 

     function doSearch() { 

      var oldContentID = contentID; 

      for (iSearch=0;iSearch<allContent.length;iSearch++) { 
       totalSearch = totalSearch + countSearch; 
       contentID = allContent[iSearch]; 
       defineContent(); 

       getXML(); 

      } 
     } 

     function getXML() { 
      $.ajax({ 
       type: "GET", 
       url: langFile, 
       dataType: "xml", 
       beforeSend: function(){ 

        $('#results-list').empty(); 
        $('#results-list').hide(); 
        $('#loading').addClass('loading'); 
       }, 
       success: function(xml) { 

        var totalElements; 
        var intSearch = 0; 
        totalSearch = totalSearch + countSearch; 
        countSearch = 0; 
        var searchText = $('#text').val().toLowerCase(); 

        totalElements = $(xml).find('news').length; 


        while (intSearch < totalElements) { 
         oFeed = $(xml).find('news:eq('+intSearch+')'); 
         var headline = oFeed.find('headline').text(); 
         var newsText = oFeed.find('detail').text(); 
         var section = oFeed.find('section').text(); 
         var category = oFeed.attr('category'); 

         var stripEnters = newsText.match(/\r?\n|\r/gi); 
         if (stripEnters != null) { 
          for (var s = 0; s < stripEnters.length ; s++){ 
           newsText = newsText.replace(stripEnters[s],''); 
          } 
         } 

         var newsText2 = $.htmlClean(newsText, {format:true}); 
         var newsText3 = $(newsText2) 
         var newsText4 = $(newsText3).text(); 
         var newsText5 = newsText4.replace(/\W/gi, ""); 

         if (section.toLowerCase() == "news" || section.toLowerCase() == "featured") { 
          if (headline.toLowerCase().indexOf(searchText) >= 0) { 
           $('<dt></dt>').html(headline).appendTo('#results-list'); 
           $('<dd></dd>').html(newsText).appendTo('#results-list'); 
           countSearch++; 
          }//end if 
          else if (newsText5.toLowerCase().indexOf(searchText) >= 0) { 
           $('<dt></dt>').html(headline).appendTo('#results-list'); 
           $('<dd></dd>').html(newsText).appendTo('#results-list'); 
           countSearch++; 
          } 
         } 
         intSearch++; 
        }   

       } 
      }); 
     } 

在回調結束時，我需要運行以下操作，但是它現在在完成所有回調之前執行此功能。

 function displayResults() { 
      if (totalSearch == 0) 
      { 
       alert("No results found"); 
       $('#loading').removeClass('loading'); 
       $('#main').fadeIn(1000); 
      } 
      else { 
       dynamicFaq(); 
       $('<p></p>').html(totalSearch + ' Results found').prependTo('#results-list'); 
       $('#results-list').fadeIn(1000); 
       $('#loading').removeClass('loading'); 
      } 
     } 

Answer 1

如果我的理解是否正確，要加載1個XML文件，循環，然後開始加載下一個XML文件。如果是這樣，這裏是一個小的僞代碼：

function doSearch(int xmlFileIterator){ 
    if (xmlFileIterator < allContent.length) { 
     ... 
     contentID = allContent[xmlFileIterator]; 
     ... 
     getXml(xmlFileIterator); 
    } else { 
     //no more xml files left 
     displayResults(); 
    } 
} 

function getXml(int xmlFileIterator) { 
    ... 
     success: function() { 
      ... 
      doSearch(++xmlFileIterator); 
     } 
} 

第一個電話是doSearch(0)其加載第一個XML文件。文件加載完成後，循環完成（成功）後，可以使用更高數字（迭代器）再次調用doSearch函數。

Answer 2

我看到你的AJAX調用是異步的。嘗試使用

  .... 
      type: "GET", 
      url: langFile, 
      async: false, 
      dataType: "xml", 
      ..... 

Answer 3

保持一個ajax隊列，這樣ajax調用就會一個接一個完成。加上維護一個全局變量searchingCount，它將維護主要的xml是如何被處理的。

在完成對searchCount的ajax檢查並調用displayResults函數的回調函數。

var allContent = ["xmlfile1", "xmlfile2", "xmlfile3", "xmlfile4"]; 
var totalSearch = 0; 
var countSearch = 0; 
var searchedCount = 0; 

var ajaxQueue = $({}); 
$.ajaxQueue = function (ajaxOpts) { 
    // Hold the original complete function. 
    var oldComplete = ajaxOpts.complete; 
    // Queue our ajax request. 
    ajaxQueue.queue(function (next) { 
     // Create a complete callback to fire the next event in the queue. 
     ajaxOpts.complete = function() { 
      // Fire the original complete if it was there. 
      if (oldComplete) { 
       oldComplete.apply(this, arguments); 
      } 
      // Run the next query in the queue. 
      next(); 
     }; 
     // Run the query. 
     $.ajax(ajaxOpts); 
    }); 
}; 

function doSearch() { 

    var oldContentID = contentID; 
    searchedCount = 0; 
    for (iSearch = 0; iSearch < allContent.length; iSearch++) { 
     totalSearch = totalSearch + countSearch; 
     contentID = allContent[iSearch]; 
     defineContent(); 
     searchedCount++; 
     getXML(); 

    } 
} 

function getXML() { 
    $.ajaxQueue({ 
     type: "GET", 
     url: langFile, 
     dataType: "xml", 
     beforeSend: function() { 

      $('#results-list').empty(); 
      $('#results-list').hide(); 
      $('#loading').addClass('loading'); 
     }, 
     success: function (xml) { 

      //your code 

     }, 
     complete: function() { 
      if (searchedCount == allContent.length) { 
       displayResults() 
      } 
     } 
    }); 
}