Javascript jquery中的筛选器列表及其子级

这是我的html代码：

<input class="form-control" id="myInput" type="text" placeholder="Search..">
<ul class="list-group" id="myList" data-role="listview" data-divider-theme="a" data-inset="true">
    <li data-role="list-divider" role="heading" class="list-group-item">
         <h1>b - B</h1>
    </li>
    <li data-role="collapsible" data-inset="false">
         <h3>backbiting</h3>
             <div class="card">
                 <div class="card-body text-left">
                      <div class="card-text"><p>Loreum Ipsum</p></div>
                 </div>
             </div>
    </li>

我想搜索/过滤工作在li>h3元素上，上面的代码正在工作，但我不能在每个列表下隐藏卡片。我该怎么做

---

我认为你在隐藏李和h3方面遇到了问题。 在这里，您只选择了myList h3，所以只有该段将隐藏在过滤器上。要隐藏li，必须同时选择两个元素，即该元素的父元素。所以，不要选择myList h3，而是选择myList li并在筛选器中使用$this。查找“h3”。筛选器的文本如下所示

$("#myInput").keyup(function() {
        var value = $(this).val().toLowerCase();
        $("#myList li").filter(function() {
            $(this).toggle($(this).find('h3').text().toLowerCase().indexOf(value) > -1)
        });
    });

---

我想这应该可以解决您的问题。

如果我这样做，那么过滤器会在上工作，我只想过滤里面的文本。因此，当使用搜索时，也会出现一个包含在里面的单词。我只想过滤里面的单词

$("#myInput").keyup(function() {
        var value = $(this).val().toLowerCase();
        $("#myList li").filter(function() {
            $(this).toggle($(this).find('h3').text().toLowerCase().indexOf(value) > -1)
        });
    });