Question

我正在XML文件中搜索包含输入字段中的子字符串的某些项目。搜索首先起作用，但是如果我删除输入并再次写入内容它就不再起作用了。我正在为找到的每个项目创建一个表格行，因为我需要稍后使用它们。如果项目不再与搜索输入匹配，我还会从表中删除一行。顺便说一句，我知道从XML读取这样的内容在CHROME中不起作用，但我使用Firefox进行检查。

我的剧本：

<script>
  var inTable = new Set();

  function showResult(str) {
    if (str.length == 0) {
      document.getElementById("livesearch").innerHTML = "";
      document.getElementById("livesearch").style.border = "0px";
      return;
    }
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
      if (xhttp.readyState == 4 && xhttp.status == 200) {
        myFunction(xhttp, str);
      }
    };
    xhttp.open("GET", "Menu.xml", true);
    xhttp.send();
  }

  function myFunction(xml, str) {
    var tbody = document.getElementById('livesearch');
    var i;
    var xmlDoc = xml.responseXML;
    var x = xmlDoc.getElementsByTagName("ITEM");
    for (i = 0; i < x.length; i++) {
      a = x[i].getElementsByTagName("NAME")[0].childNodes[0].nodeValue.toString();
      if (a.toLowerCase().indexOf(str) != -1) {
        if (inTable.has(a) == false) {
          console.log("add to table");
          inTable.add(a);
          var tr = document.createElement('tr');
          tr.setAttribute('name', a);
          var td = document.createElement('td');
          td.innerHTML = x[i].getElementsByTagName("NAME")[0].childNodes[0].nodeValue;
          tr.appendChild(td);
          td = document.createElement('td');
          td.innerHTML = x[i].getElementsByTagName("PRICE")[0].childNodes[0].nodeValue;
          tr.appendChild(td);
          td = document.createElement('td');
          td.innerHTML = x[i].getElementsByTagName("DESC")[0].childNodes[0].nodeValue;
          tr.appendChild(td);
          tr.setAttribute('onclick', 'changeSomething();');
          tbody.appendChild(tr);
        } else console.log("it exists in table");
      } else if (inTable.has(a) == true) {
        console.log("deletes from table");
        inTable.delete(a);
        var y = document.getElementsByName(a)[0];
        tbody.deleteRow(y.rowIndex);
      }
    }
  }
  changeSomething = function() {
    document.getElementById('demo').style.visibility = 'hidden';
  }

</script>

HTML部分：

<form>
  <input type="text" size="30" onkeyup="showResult(this.value)">
  <table id="livesearch"></table>
  <div id="demo"></div>
</form>

XML文件：

<?xml version="1.0" encoding="ISO-8859-1"?>
<MENU>
    <ITEM>
        <NAME>CARTOFI PRAJITI</NAME>
        <PRICE>6 LEI</PRICE>
        <DESC>300 g</DESC>
    </ITEM>
    <ITEM>
        <NAME>PASTRAV INVELIT IN SUNCA AFUMATA</NAME>
        <PRICE>43 lei</PRICE>
        <DESC>Pastrav</DESC>
    </ITEM>

</MENU>

感谢。

Answer 1

当str的长度为零时，你必须清除Set。

添加＆＃39; inTable.clear（）;＆＃39;

if (str.length == 0) {
  document.getElementById("livesearch").innerHTML = "";
  document.getElementById("livesearch").style.border = "0px";
  inTable.clear();
  return;
}

Ajax搜索无法正常工作

1 个答案: