如何使用JQUERY AJAX和HTML每30秒从XML读取和显示数据

Question

I am a beginner would be great if someone help me on this. 如果有人在这方面帮助我，我将是一个很好的初学者。

I need to read and display data (HTML / PHP page) from XML for every 30 seconds. 我需要每30秒从XML读取和显示数据（HTML / PHP页面）。

XML FILE : XML文件：

<MAINData>
  <LiveData>
   <Field no="1">ENG ODI</Field>
   <Field no="2">ENG</Field>
   <Field no="3">IND ODI</Field>
   <Field no="4">IND</Field>
   <Field no="5">STRAUSS</Field>
   <Field no="6">PIETERSEN</Field>
   <Field no="7">TROTT</Field>
   <Field no="8">BELL</Field>
   <Field no="9">COLLINGWOOD</Field>
   <Field no="10">PRIOR</Field>
   <Field no="11">YARDY</Field>
   <Field no="12">BRESNAN</Field>
   <Field no="13">SWANN</Field>
   <Field no="14">SHAHZAD</Field>
   <Field no="15">ANDERSON</Field>
   <Field no="16">LBW B KHAN</Field>
   <Field no="17">C AND B PATEL</Field>
   <Field no="18">LBW B CHAWLA</Field>
   <Field no="19">C KOHLI B KHAN</Field>
  </LiveData>
</MAINData>

Here is my HTML File : 这是我的HTML文件：

 <!DOCTYPE html> <html lang="en"> <head> <script src="http://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script> <script type="text/javascript"> $.ajax({ type: "GET", url: "LiveData.xml", dataType: "xml", success: function (xml) { var xmlDoc = $.parseXML(xml), $xml = $(xmlDoc); $xml.find('Field[no="1"]').each(function () { $("#news-container").append($(this).text() + "<br />"); } ); } }); </script> </head> <body> <div class="wrap" id="news-container"> </div> </body> </html>

I wanted to fetch specific details from the XML file and display it in the html page. 我想从XML文件中获取特定的详细信息，并将其显示在html页面中。 Also another thing is I need to fetch this for every 30 seconds without refreshing the page. 另外，我需要每30秒获取一次而不刷新页面。

Answer 1

In your ajax request you specified that the data will be xml, in which case you will get back an xml document in your success handler, therefore do not call $.parseXML . 在ajax请求中，您指定了数据将为xml，在这种情况下，您将在成功处理程序中返回一个xml文档，因此不要调用$.parseXML 。
Getting the data every 30 seconds is just a matter of calling setTimer or setTimeout setting the timeout to 30 seconds 每30秒获取一次数据只需调用setTimer或setTimeout将超时设置为30秒即可

function getData(){
  $.ajax({
    type: "GET",
    url: "LiveData.xml",
    dataType: "xml",
    success: function (xml) {
            $xml = $(xml);
            $xml.find('Field[no="1"]').each(function () {
              $("#news-container").append($(this).text() + "<br />");

            });
    },
    complete: function(){
        setTimeout(getData, 30000);
    }
  });
}

getData();

如何使用JQUERY AJAX和HTML每30秒从XML读取和显示数据

问题描述

1 个解决方案

解决方案1
3 已采纳 2018-02-20 13:10:05

如何使用JQUERY AJAX和HTML每30秒从XML读取和显示数据

问题描述

1 个解决方案

解决方案1 3 已采纳 2018-02-20 13:10:05

解决方案1
3 已采纳 2018-02-20 13:10:05