如果搜索到的文本不存在，如何隐藏 div答案

【问题标题】：How to hide a div if searched text not exist如果搜索到的文本不存在，如何隐藏 div
【发布时间】：2022-01-14 04:12:37
【问题描述】：

我能够过滤掉数据，如果搜索到的文本不存在，我现在试图隐藏一个 div。有什么办法吗。

<input type="text" placeholder="Search" class=".bar-input">
    <div class="xyz"> hide me if searched value doesn't match</div>
    <ul class=".myUL">
      <li>one</li>
      <li>two</li>
      <li>three</li>
      <li>four</li>
      <li>five</li>
      <li>six</li>
    </ul>
    
    $('.bar-input').on('keyup', function() {
      var input_val = $('.bar-input').val();
      var tags = $('.myUL > li');
      var count = tags.length;
      for (i = 0; i < count; i++) {
          if (!input_val || tags[i].textContent.toLowerCase().indexOf(input_val) > -1) {
              tags[i].style['display'] = 'block';
             
          } else {
              tags[i].style['display'] = 'none';
          }
      }
    });

【问题讨论】：

标签： javascript html jquery jquery-ui

【解决方案1】：

在这里，如果这对你有用，请接受。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<input type="text" placeholder="Search" class="bar-input">

<div class="xyz"> hide me if searched value doesn't match</div>
    <ul class="myUL">
      <li>one</li>
      <li>two</li>
      <li>three</li>
      <li>four</li>
      <li>five</li>
      <li>six</li>
    </ul>
    
    <script>
    
    $('.bar-input').on('keyup', function() {
      var input_val = $('.bar-input').val();
      var tags = $('.myUL > li');
      var count = tags.length;
      var match_cnt = 0;
      for (i = 0; i < count; i++) {
          if (!input_val || tags[i].textContent.toLowerCase().indexOf(input_val) > -1) {
              tags[i].style['display'] = 'block';
              
              match_cnt++;
             
          } else {
              tags[i].style['display'] = 'none';
          }
      }
      if(match_cnt<1) {
        $('.xyz').hide();
      } else {
        $('.xyz').show();
      }
    }); 
    
    </script>

【讨论】：