循环遍历XML文件jQuery

时间:2013-04-04 08:39:06

标签: javascript jquery xml json

我有点困在以下问题。

我有几个用ID标记的XML文件(每个XML都由一个值id)。我现在正在尝试遍历这些文件并将其内容输出到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');
            }   
        }

3 个答案:

答案 0 :(得分: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函数。

答案 1 :(得分:0)

我看到你的AJAX调用是异步的。尝试使用

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

答案 2 :(得分:0)

维护一个ajax队列,以便ajax调用将逐个完成。加上维护一个全局变量searchingCount,它将维护主xml的处理方式。

在ajax的完全回调检查searchCount并调用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()
            }
        }
    });
}