Sayfalar

Translate Blog

jquery ile filtre etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
jquery ile filtre etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

16 Temmuz 2014 Çarşamba

Jquery ile Basit Filtreleme Yapmak / Make a Simple Filter With Jquery Filter

[Sayfanızda Jquery yüklemeyi unutmayın.]

Sayfanızdaki aşağıdaki gibi içinde data-type tagı barındıran <li> ler bulunsun, data-type değerinin oku kelimesi olduğunu görüyorsunuz.

<li data-type='oku'>
          <img src="kelimeislemci/kelimeler/okumak_2.jpg">
</li>

Aşağıdaki scripti sayfada çalıştırırsanız sayfanızdaki diğer <li> tagları display özellikleri none'a eşitlenecek yani gizlenecektir.

<script>
$(function () {
var sonuc = $('ul').find('li[data-type!=oku]');
sonuc.css('display','none');
});
</script>


You can use <li data-type="word"> to filter objects on the page. you can use other tags too, I just use this.
If you want to search/filter a word,  use above script. This script make your list hide, except <li> that has data-type=word

<li data-type='word'> word - 1 </li>
<li data-type='book'> word - 2 </li>
<li data-type='school'> word - 3 </li>
<script>
$(function () {
var sonuc = $('ul').find('li[data-type!=word]');
sonuc.css('display','none');
});
</script>

Above code only display word-1, others will be hidden.