Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/69.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用jQuery搜索XML并显示结果_Javascript_Jquery_Ajax_Xml - Fatal编程技术网

Javascript 使用jQuery搜索XML并显示结果

Javascript 使用jQuery搜索XML并显示结果,javascript,jquery,ajax,xml,Javascript,Jquery,Ajax,Xml,我有多个包含电视节目表的XML文件,每个文件是一个电视频道。我希望能够通过程序标题进行搜索,并在html表格中显示结果。到目前为止,我已经能够通过一个XML文件进行搜索,也就是通过一个通道进行搜索。我希望能够通过输入框和搜索按钮使用用户输入通过多个渠道进行搜索。我使用的XML如下所示: <?xml version="1.0" encoding="UTF-8"?> <channel id="sky_one" source="Sky" date="25/11/2014">

我有多个包含电视节目表的XML文件,每个文件是一个电视频道。我希望能够通过程序标题进行搜索,并在html表格中显示结果。到目前为止,我已经能够通过一个XML文件进行搜索,也就是通过一个通道进行搜索。我希望能够通过输入框和搜索按钮使用用户输入通过多个渠道进行搜索。我使用的XML如下所示:

<?xml version="1.0" encoding="UTF-8"?>

<channel id="sky_one" source="Sky" date="25/11/2014">
  <programme>
<desc>Tony's motorcycle bursts into flames between his legs while town planner Liz is left in agony after her half-tonne horse bolts and lands on top of her. Also in HD</desc>
<title>The Real A &amp; E</title>
<end>0630</end>
<start>0600</start>
  </programme>
$(document).ready(function () {

  //GLOBAL VAR
  var keyword = '';
  var pub = ''; 

  var i = 0;

  $("#searchButton").click(function () {
    keyword = $("input#term").val();

    //Reset any message
    var errMsg = '';
    pub = '';

    if (keyword == '') {
      errMsg += 'Please enter a search term';
    } else {
      searchThis();
    }

    if (errMsg != '') {
      pub += '<div class="error">';
      pub += errMsg;
      pub += '</div>';
    }

    //Show error
    $('#result').html(pub);

  });

// ----------------------------------------- SKY NEWS -----------------------------------------------------------

  function searchThis() {
    $.ajax({
      type: "GET",
      url: "https://scm.ulster.ac.uk/~B00533474/workspace/COM554/assignment_2/CR/sky_one.xml",
      dataType: "xml",
      success: function (xml) {
        loadPublication(xml)
      }
    });
  }

  function loadPublication(xmlData) {
    i = 0;
    var row;

    var searchExp = "";

    $(xmlData).find('programme').each(function () {

      var title = $(this).find('title').text();
      var desc = $(this).find('desc').text();
      var start = $(this).find('start').text();

      //Format the keyword expression
      var exp = new RegExp(keyword, "gi");

      //Match to Title of programme
      searchExp = title.match(exp);

      if (searchExp != null) {

        //Start building the result
        if ((i % 2) == 0) {
          row = 'even';
        } else {
          row = 'odd';
        }

        i++;

        pub += '<tr class="row ' + row + '">';
        pub += '<td valign="top" class="col1">' + title + '</td>';
        pub += '<td valign="top" class="col2">' + desc + '</td>';
        pub += '<td valign="top" class="col3">' + start + '</td>';
        pub += '</tr>' + 'n';
      }
    });

    if (i == 0) {
      pub += '<div class="error">';
      pub += 'No Result was Found';
      pub += '</div>' + 'n';

      //Populate the result
      $('#result').html(pub);
    } else {
      //Pass the result set
      showResult(pub);
    }
  }

  function showResult(resultSet) {

    //Show the result
    pub = '<div class="message">There are ' + i + ' results!</div>';
    pub += '<table id="grid" class="table-bordered">';
    pub += '<thead><tr>' + 'n';
    pub += '<th class="col1"> </th>';
    pub += '<th class="col2">Title</th>';
    pub += '<th class="col3">Desc</th>';
    pub += '<th class="col4">Start</th>';
    pub += '</tr></thead>';
    pub += '<tbody>';

    pub += resultSet;

    pub += '<hr class="horule" />';
    pub += '</tbody>';
    pub += '</table>';

    //Populate
    $('#result').html(pub)

  }
});
预期的输出是一个带有标题、说明和程序时间的html表。如果有人能帮忙,那就太好了

<input type="text" id="term" placeholder="Search by program title..."></div>
</div>
<input type="button" id="searchButton" value="Search" class="btn btn-primary" />
<div id="result"> </div>
 // Open the xml file
        var sky1 = 'https://scm.ulster.ac.uk/~B00533474/workspace/COM554/assignment_2/CR/sky_one.xml',
            bbc1 = 'https://scm.ulster.ac.uk/~B00533474/workspace/COM554/assignment_2/CR/bbc1.xml',
            skyn = 'https://scm.ulster.ac.uk/~B00533474/workspace/COM554/assignment_2/CR/sky_news.xml';
        $.when(
            $.ajax( sky1 ),
            $.ajax( bbc1 ),
            $.ajax( skyn )
        ).then(function( skyone, bbcone, skynews ) {
            var sky1p = $(skyone).find('programme'),
                bbc1p = $(bbcone).find('programme'),
                skynp = $(skynews).find('programme');
//sky one
            sky1p.each(function() {
//DO Search

//sky one
            skynp.each(function() {
//DO Search
//sky one
            bbcp.each(function() {
//DO Search