将xml载入div时的AJAX竞争条件

Question

The website that I am creating has information that is used on multiple pages. The way I have it setup is that the information is stored in xml files. I then use AJAX to load the xml files and on success I call a parsing method that appends th.

It seems that there is a race condition happening. The page finishes loading before the xml file is finished parsing. If I add an alert in the parsing method, then it works fine (which is why I think its a race condition).

function loadXML(link) {

$('#div1').load(link);
loadImage(link);

if (link == "news.html") {
    $.ajax({
        type: "GET",
        url: "news.xml",
        dataType: "xml",
        success: newsParser
     });
  }
}

When I've searched online I've seen things about maybe using a semaphore or timeout. Neither of these seemed to work for me very well.

If the html page isn't loaded before the xml then there is no div to add the information to. I also tried to load the different xml files when you go to the page and store the data so that it isn't parsed every time you go to the specific page but I wasn't successful at figuring that out.

I appreciate any help provided!

Answer 1

You can wait for the DOM to load using jQuery (which you're already using): $().ready() - http://api.jquery.com/ready/

$(document).ready(function(){ 
  $('#div1').load(link); 
  loadImage(link); 
  //etc..
}