jquery show div検索結果が返されない場合のみ

Question

私は以下のコードを持っています。 ＃no-results要素は、結果が見つからない場合にのみ表示される必要があります。現在はIFの検索結果があります。

$('#no-results').hide(); 
     $('#video-search-text').keyup(function() { 
      $('.video-search').hide(); 
      $('#no-results').css("display", "none"); 
      var txt = $('#video-search-text').val(); 

      $('.video-search').each(function() { 
       if ($(this).text().toUpperCase().indexOf(txt.toUpperCase()) != -1) { 
        $(this).show(); 

       } 
       else { 
         $('#no-results').css("display", "block"); 

       } 
      }); 

     }); 

私は、便宜上、以下のJSFiddleを作成しました。ありがとう

Answer 1

forループごとに結果がないかどうかのチェックを削除し、検索が完了したら配置します。 like

$('#no-results').hide(); 
$('#video-search-text').keyup(function() { 
    $('.video-search').hide(); 
    $('#no-results').css("display", "none"); 
    var txt = $('#video-search-text').val(); 
    var resultCount = 0; 
    $('.video-search').each(function() { 
     if ($(this).text().toUpperCase().indexOf(txt.toUpperCase()) != -1) { 
      $(this).show(); 
      resultCount++; 
     } 
    }); 

    if (resultCount == 0) { 
     $('#no-results').css("display", "block"); 
    } 

}); 

Answer 2

Jamesはあなたに良い解決策を与えました。 は基本的に、問題が

$('.video-search').each(function() 

は、あなたのjsFiddleで「ABC」を検索したとこのループから来て、それは最初<h1>との一致を見つけるでしょう。これは最初のブロックに入るので、 '見つからなかった結果'は表示されません。

しかし、各要素についてループしているので、 'abc'と 'def'を比較し、elseブロックに入ります。 「ghi」と比較して同じことが起こります。