jQuery - Filters

jQuery를 사용하여 특정 요소를 필터링/검색합니다.

테이블의 항목에 대해 대소 문자를 구분하지 않는(case-insensitive) 검색을 실행합니다:

$(document).ready(function () {
      $("#myInput").on("keyup", function () {
        var value = $(this).val().toLowerCase();
        $("#myTable tr").filter(function () {
          $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
        });
      });
    });

예제 설명:
각 테이블 행을 반복하도록 jQuery를 사용하여 입력 필드의 값과 일치하는 텍스트 값이 있는지 확인합니다.
toggle() 메서드는 검색과 일치하지 않는 행 (display:none“”)을 숨깁니다.
toLowerCase()'' DOM 메서드를 사용하여 텍스트를 소문자로 변환하면, 검색이 대소문자를 구분하지 않습니다
(검색시 “john”, “John”및 “JOHN”허용)

목록의 항목에 대해 대소문자를 구분하지 않는 검색을 실행합니다.

    $(document).ready(function () {
      $("#myInput").on("keyup", function () {
        var value = $(this).val().toLowerCase();
        $("#myList li").filter(function () {
          $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
        });
      });
    });

div 요소 내의 텍스트에 대해 대소문자를 구분하지 않는 검색을 수행합니다.

    $(document).ready(function () {
      $("#myInput").on("keyup", function () {
        var value = $(this).val().toLowerCase();
        $("#myDIV *").filter(function () {
          $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
        });
      });
    });