Problem with Sending XML Requests_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-04-06 14:35 出处：网络

Writing a basic XML file reader into an HTML page. I am having trouble reading from the XML file. Here\'s my set up: I have three text fields and a button. When the button is pressed, therequest is pu

相关专题：javascript xml

Writing a basic XML file reader into an HTML page. I am having trouble reading from the XML file. Here's my set up: I have three text fields and a button. When the button is pressed, the request is put in to grab three pieces of XML and to populate the three text fields. However, I am running into trouble with the status of the request. I am getting the status code 0, instead of 200. According to my research (http://www.daniweb.com/web-development/javascript-dhtml-ajax/threads/282972), I think it has to do with cross domain blocking. I have tried putting the source XML both locally and on a server.

<html>
<head>
<script type="text/javascript">
function displayQuotes()
{
    var xmlhttp;
    xmlhttp=new XMLHttpRequest();
    xmlhttp.onreadystatechange=function()
    {
        //if (xmlhttp.readyState==4 && xmlhttp.status==200)
        //{
            document.getElementById("quote1").innerHTML=xmlhttp.sta开发者_JAVA百科tus;
        //}
    }   
    xmlhttp.open("GET","http://filebox.vt.edu/users/yiuleung/project5/letter.xml",true);
    xmlhttp.send();
    xmlDoc=xmlhttp.responseXML;

    document.getElementById("quote1").innerHTML=
        xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
    document.getElementById("quote2").innerHTML=
        xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;
    document.getElementById("quote3").innerHTML=
        xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;
}
</script>
</head>
<body>
<div id="quote1" style="margin:0;padding:0;position:absolute;left:65px;top:319px;width:250px;height:16px;text-align:left;z-index:2;">
    <font style="font-size:13px" color="#000000" face="Arial">Quote 1</font></div>

<div id="quote2" style="margin:0;padding:0;position:absolute;left:65px;top:389px;width:250px;height:16px;text-align:left;z-index:3;">
    <font style="font-size:13px" color="#000000" face="Arial">Quote 2</font></div>

<div id="quote3" style="margin:0;padding:0;position:absolute;left:65px;top:458px;width:250px;height:16px;text-align:left;z-index:4;">
    <font style="font-size:13px" color="#000000" face="Arial">Quote 3</font></div>

<input type="button" id="shuffle_button" name="" value="Shuffle" onClick=displayQuotes() style="position:absolute;left:316px;top:228px;width:96px;height:25px;font-family:Arial;font-size:13px;z-index:10">
</body>
</html>

You use xmlhttp.open("GET","letter.xml",true); - it open XMLHttpRequest in async mode. But next two lines of your code expected to work in sync mode. You need to switch to sync mode: xmlhttp.open("GET","letter.xml",false); or (better) to modify code for work in async mode, as in example below:

function displayQuotes()
{
  var xmlhttp;
  xmlhttp=new XMLHttpRequest();
  xmlhttp.open("GET","letter.xml",true);
  xmlhttp.onreadystatechange=function() {
    console.info(xmlhttp.readyState,"|",xmlhttp.status,"|",xmlhttp.statusText); // for debugging only
    if(xmlhttp.readyState===4&&xmlhttp.status===200) {
      // HTTP OK
      xmlDoc=xmlhttp.responseXML; // maybe var xmlDoc ???
      document.getElementById("quote1").innerHTML=
        xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
      document.getElementById("quote2").innerHTML=
        xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;
      document.getElementById("quote3").innerHTML=
        xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;
    }
  };
  xmlhttp.send(null);
}

Using XMLHttpRequest in MDN: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest