Question

 <script>

 function myFunction() {
      // Declare variables 
      var input, filter, table, tr, td, i, occurrence;

      input = document.getElementById("myInput");
      filter = input.value.toUpperCase();
      table = document.getElementById("helpseekers");
      tr = table.getElementsByTagName("tr");

      // Loop through all table rows, and hide those who don't match the search query
     for (i = 0; i < tr.length; i++) {
         occurrence = false; // Only reset to false once per row.
         td = tr[i].getElementsByTagName("td");
         for(var j=0; j< td.length; j++){                
             currentTd = td[j];
             if (currentTd ) {
                 if (currentTd.innerHTML.toUpperCase().indexOf(filter) > -1) {
                     tr[i].style.display = "";
                     occurrence = true;
                 } 
             }
         }
         if(!occurrence){
             tr[i].style.display = "none";
         $('#error4').html('<p style="color:red;font-size:14px;" align="center">No results found</p>');
           window.setTimeout(function(){location.reload()},3000)
         } 
     }
   }
</script>

这是从表中搜索和显示数据的代码。搜索效果很好，但即使搜索到的数据在表中，它也会显示搜索结果的“无结果发现消息”。我得到了搜索到的数据，但没有找到结果消息。只有当搜索结果不在表格中时，我才需要警告信息“找不到结果”。

Answer 1

纯粹根据您提供的代码判断，对于每个表行似乎只要有一个没有出现，弹出No results found消息并在3秒后重新加载页面。如果您只想显示当所有表行都没有出现时，请尝试下面的代码。它没有经过测试，因此可能会或可能不会起作用。

基本上我所做的就是添加一个counter，每当if块进入!occurrence时，它会递增。因此，如果它与tr.length匹配，则表示每个表行都没有出现，然后才显示未找到的消息。

<script>

function myFunction() {
  // Declare variables 
  var input, filter, table, tr, td, i, occurrence;
  var counter = 0;

  input = document.getElementById("myInput");
  filter = input.value.toUpperCase();
  table = document.getElementById("helpseekers");
  tr = table.getElementsByTagName("tr");

  // Loop through all table rows, and hide those who don't match the search query
 for (i = 0; i < tr.length; i++) {
     occurrence = false; // Only reset to false once per row.
     td = tr[i].getElementsByTagName("td");
     for(var j=0; j< td.length; j++){                
         currentTd = td[j];
         if (currentTd ) {
             if (currentTd.innerHTML.toUpperCase().indexOf(filter) > -1) {
                 tr[i].style.display = "";
                 occurrence = true;
             } 
         }
     }
     if(!occurrence){
         tr[i].style.display = "none";
         counter++;
     } 
 }
     if(counter === tr.length){
           $('#error4').html('<p style="color:red;font-size:14px;" align="center">No results found</p>');
       window.setTimeout(function(){location.reload()},3000)
 }
}
</script>

Answer 2

我认为你需要使用不同的标志来检查是否在表中找到了搜索关键字。 occurrence用于隐藏和显示基于搜索关键字的表格行。因此，您可以使用另一个变量来打印“找不到结果”。

在此处发布已编辑的代码。我添加了一个布尔变量found作为搜索查询的标志。

<script>
 function myFunction() {
      // Declare variables 
      var input, filter, table, tr, td, i, occurrence, found=false;

      input = document.getElementById("myInput");
      filter = input.value.toUpperCase();
      table = document.getElementById("helpseekers");
      tr = table.getElementsByTagName("tr");

      // Loop through all table rows, and hide those who don't match the search query
     for (i = 0; i < tr.length; i++) {
         occurrence = false; // Only reset to false once per row.
         td = tr[i].getElementsByTagName("td");
         for(var j=0; j< td.length; j++){                
             currentTd = td[j];
             if (currentTd ) {
                 if (currentTd.innerHTML.toUpperCase().indexOf(filter) > -1) {
                     tr[i].style.display = "";
                     occurrence = true;
                     found = true;
                 } 
             }
         }

        if(!occurrence){
             tr[i].style.display = "none";
         } 

     }

    if(!found){
         $('#error4').html('<p style="color:red;font-size:14px;" align="center">No results found</p>');
           window.setTimeout(function(){location.reload()},3000)
    } 
   }
</script>

Answer 3

应该在主循环之外（循环遍历行）显示“找不到结果”。否则，对于不匹配的每一行，您将显示“未找到结果”一次。此外，如果最终要确定找到了某些行，则不应在每行重置occurrence标志。

未找到结果消息显示搜索到的数据

3 个答案: