按首字母过滤列表项

Filtering list items by the first letter

本文关键字：列表 过滤      更新时间：2023-09-26

我有一个列表项列表。我正试着过滤掉按首字母显示的项目。

筛选列表:

<ul class="myFilters">
<li data-type="A">A</li>
<li data-type="B">B</li>
<li>etc...</li>
</ul>

列表
<ul class="myFilterItems">
<li>Apple</li>
<li>Banana</li>
<li>etc...</li>
</ul>

理想情况下，点击.myFilters中的li将只显示.myFilterItems中以该字母开头的项目。

您可以尝试以下内容

$('.myFilters li').click(function(){
   var v = $(this).text()[0]
   $('.myFilterItems li').hide().filter(function(){
      return $(this).text().toUpperCase()[0] == v;
   }).show()
})

像是…

$('.myFilters li').on("click", function() {
  var letter = $(this).text()[0];
  $('.myFilterItems li').each(function() {
    if ($(this).text()[0] == letter) {
      $(this).show();
    } else {
      $(this).hide();
    }
  });
});

您可能想要处理大小写敏感性(s或s)等，但这应该可以工作…

相关文章：