过滤HTML表

Question

我在一些HTML标记旁边找到了这个JS，并更改了id，使其表示我的表类和输入类。但不知何故，它不会起作用。对我做错了什么有什么建议吗？

如果我将原始代码和创建的简单表放入代码中，它就会像一个护身符一样工作。

​

function filteringTable() {
  var input, filter, table, tr, td, i;
  input = document.getElementsByClassName("tableFilter");
  filter = input.value.toUpperCase();
  table = document.getElementsByClassName("tableSqlContent");
  tr = table.getElementsByTagName("tr");

  for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[1];
    if (td) {
      if (td.innerTEXT.toUpperCase().indexOf(filter) > -1) {
        tr[i].style.display = "";
      } else {
        tr[i].style.display = "none";
      }
    }
  }
}

<input type="text" class="tableFilter" onkeyup="filteringTable()" placeholder="Søg kunde..">

<table class="tableSqlContent">
  <tr>
    <th>Connectionstring</th>
    <th>Klinik Navn</th>
    <th>IP_Adresse</th>
    <th>P-nummer</th>
    <th>Systemtype</th>
    <th>Version</th>
  </tr>

  <?php
    foreach($dbh->query($query) as $rows){
  ?>
    <tr>
      <td><?php echo $rows['ConnectionString']?></td>
      <td><?php echo $rows['Name']?></td>
      <td><?php echo $rows['IP_Adresse']?></td>
      <td><?php echo $rows['Ydernummer']?></td>
      <td><?php echo $rows['Systemtype']?></td>
      <td><?php echo $rows['Version']?></td>
    </tr>
  <?php
    }
  ?>
</table>

​

Answer 1

这对你有效吗？对我来说很管用

<script>
function filteringTable() {
  var input, filter, table, tr, td, i;
  input = document.getElementById("keyword").value;
  filter = input.toUpperCase();
  table = document.getElementById("results");

  tr = table.getElementsByTagName("tr");

  for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[1];
    if (td) {
      if (td.innerText.toUpperCase().indexOf(filter) > -1) {
        tr[i].style.display = "";
      } else {
        tr[i].style.display = "none";
      }
    }
  }
}
</script>


<input type="text" class="tableFilter" onkeyup="filteringTable()" id="keyword" placeholder="Søg kunde..">

<table class="tableSqlContent" id="results">
  <tr>
    <th>Connectionstring</th>
    <th>Klinik Navn</th>
    <th>IP_Adresse</th>
    <th>P-nummer</th>
    <th>Systemtype</th>
    <th>Version</th>
  </tr>

    <tr>
      <td>conn a</td>
      <td> name a</td>
      <td>IP A</td>
      <td>afasd</td>
      <td>asdad</td>
      <td>V1</td>
    </tr>

        <tr>
      <td>conn B</td>
      <td> name B</td>
      <td>IP B</td>
      <td>afasd</td>
      <td>asdad</td>
      <td>V2</td>
    </tr>
</table>

你有很多问题，首先我给表和搜索栏附加了一个ID，这比简单的按类查找要好得多，脚本现在会按ID查找元素

在尝试读取TD的内容时，您还使用了InnterTEXT，而不是InnerText

如果这对你不起作用，请告诉我