首页 > 解决方案 > 如何切换不等于特定文本/类别的所有列表项?

问题描述

我有一个 HTML 列表,想要筛选特定类别。例如,我的清单是:

<ul class="myList">
  <li class="list-choose">
      <input class="input-choose" type="checkbox" id="[ID]" name="ID[]"/>
      <label class="label-choose" for=[ID]></label>

      <div class="subtitle">
         <span class="category">[category]</span>
      </div>
  </li>
</ul>

(总共有大约 40 个列表项,应按类别选择过滤)

现在我想创建一个类别过滤器(以复选框/按钮/..的形式),以便您可以选择要显示的类别并隐藏不在该选定类别中的所有其他元素。我的列表项是由一个数组(ae [category])创建的,因此列表项有自己的类别。但是我怎样才能只过滤选定的类别呢?我希望任何人都可以帮助我,因为我的 Javascript 知识不是最好的。

谢谢!

我试过这个 Javascript 但它不起作用:

function filter(element) {

var $trs = $('#myList .list-choose .subtitle input label').hide();
var regexp = new RegExp($(element).val(), 'i');
var $valid = $trs.filter(function () {
    return regexp.test($(this).find('label').text())
}).show();
$trs.not($valid).hide()

}

$('input, select').on('keyup change', function () {
if($(this).val() !== ""){
    filter(this);
} else{
    $('#myList .list-choose .subtitle').show();
}

});

标签: javascriptjquerycheckboxfiltercategories

解决方案


推荐阅读