別のものの後にAJAX関数を呼び出す

Question

私はAJAXでそれを行う方法を理解できません。私は私のページにサイドバーとdivの "コンテンツ"を持っています。サイドバーは、ボタンで作られており、onclickのそれは、古典的な関数を呼び出す：

function loadDoc(url) { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
    if (xhttp.readyState == 4 && xhttp.status == 200) { 
     document.getElementById("content").innerHTML = xhttp.responseText; 
    } 
    }; 
    xhttp.open("GET", url, true); 
    xhttp.send(); 
} 

は、それがコンテンツにボタンの「URL」をロードします。まあ、この時点ではすべてが大丈夫です。今、このURLの1つ、「TheUrl」は、タイトルなどを含むドキュメントで、divの「list」です。このリストでは、XMLファイルをロードします。私は関数に

function loadXML() { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
    if (xhttp.readyState == 4 && xhttp.status == 200) { 
    myFunction(xhttp); 
    } 
    }; 
    xhttp.open("GET", "file.xml", true); 
    xhttp.send(); 
} 
function myFunction(xml) { 
    var i; 
    var xmlDoc = xml.responseXML; 
    var table="<ul>"; 
    var x = xmlDoc.getElementsByTagName("ITEM"); 
    for (i = 0; i <x.length; i++) { 
    table += "<li>" + 
    x[i].getElementsByTagName("ELEMENT")[0].childNodes[0].nodeValue + 
    "</li>" 
    }; 
    table += "</ul>"; 
    document.getElementById("list").innerHTML = table; 
} 

を持っている。しかし、私は、XMLデータは、divの内容で作成したdivのリストに表示されるように、関数loadXML（）loadDoc後（「TheUrl」）をロードする方法が分かりません。..私は明らかですか？ ：あなたの親切な助けを事前に

<ul> 
<li><button type="button" onclick=loadDoc("OtherUrl.html")>OtherUrl</button></li> 
<li><button type="button" onclick=loadDoc("TheUrl.html").done(loadXML())>TheUrl</button></li> 
</ul> 

おかげであなたを：D

私は自分のサイドバーにそのような何かをしたいと思います。

Answer 1

あなたはそうのような最初のAJAX呼び出しのonreadystaechangeイベントにloadXML関数を呼び出すことができます：あなたは別の関数で1つの関数を呼び出すことができ

xhttp.onreadystatechange = function() { 
     if (xhttp.readyState == 4 && xhttp.status == 200) { 
      document.getElementById("content").innerHTML = xhttp.responseText; 
      // call the other function 
     loadXML(); 

     }