Lista filtrów Jquery bez rozróżniania wielkich i małych liter

Chcę filtrować listę bez rozróżniania wielkich i małych liter. Chcę dopasować tylko znak, który nie pasuje do dużych i małych liter.Lista filtrów Jquery bez rozróżniania wielkich i małych liter

XXXXXXX
YYYYYYY
xxxxx

Gdybym wpisać "X" w polu wyszukiwania wyświetla zarówno 1 i 3. dodałem poniższy kod, ale pasuje również sprawa wrażliwa.

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
</script> 
<script> 
    function filter(element) { 
     var value = $(element).val(); 
     $("#theList > li").each(function() { 
      if ($(this).text().search(value) > -1) { 
       $(this).show(); 
      } 
      else { 
       $(this).hide(); 
      } 
     }); 
    } 
</script> 
</head> 
<body> 
<input type="text" onkeyup="filter(this)" /> 
<ul id="theList"> 
    <li>xxvxvxx</li> 
    <li>yyyyyyyyyy</li> 
    <li>rrrrrrrrrr</li> 
    <li>vvvvvvvvvvv</li> 
    <li>xcvcvdfsdf</li> 
    <li>hkjhkhjkh</li> 
    <li>xzfgfhfgh</li> 
</ul> 

</body> 
</html>

Źródło

2013-08-10 user

możliwe duplikat [Czy jest to przypadek niewrażliwe jQuery: zawiera selektora?] (Http://stackoverflow.com/questions/187537/is-there- a-case-niewrażliwy-jquery-zawiera-selektor) –

Trzeba użyć indexOf

$(this).text().search(value)

miało być

$(this).text().indexOf(value)

A dlaczego chcesz dołączyć zdarzenie przy użyciu atrybutu tag.It jest złą praktyką i powinno być unikanym.

Możesz użyć jQuery, aby załączyć wydarzenie.

$('input').keyup(function() { 
    filter(this); 
}); 

function filter(element) { 
    var value = $(element).val().toLowerCase(); 
    $("#theList > li").each(function() { 
     var $this = $(this), 
      lower = $this.text; 
     if (lower.indexOf(value) > -1) { 
      $this.show(); 
     } else { 
      $this.hide(); 
     } 
    }); 
}

Check Fiddle

sama funkcja trochę lepiej używając filter

function filter(element) { 
    var value = $(element).val().toLowerCase(); 
    $("#theList > li").hide().filter(function() { 
     return $(this).text().toLowerCase().indexOf(value) > -1; 
    }).show(); 
}

Źródło

2013-08-10 10:44:46

Czy można wykonać wersję niewrażliwą na akcent? –

-1

Spróbuj tego:

function filter(element) { 
     var value = $(element).val(); 
     $("#theList > li").hide(); 
     $("#theList > li:contains('" + value + "')").show(); 
    }

Źródło

2013-08-10 10:48:28 Maverick

Wystarczy zastąpić

$(this).text().search(value) > -1

$(this).text().search(new RegExp(value, "i")) > -1

i to powinno wystarczyć. Oto praca FIDDLE

Źródło

2013-08-10 11:00:46 face

Just Add jQuery.expr[":"].contains = function (a, i, m) { return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;};

Źródło

2015-08-18 10:54:01

Lista filtrów Jquery bez rozróżniania wielkich i małych liter

Odpowiedz

Powiązane problemy