Question

我想搜索所有列表项并仅显示包含某个短语的项目。

然而，我把内容放在了一个范围内。这意味着我的列表看起来有点像这样：

<ul class="sortable">
<li><span>search keywords here</span>A lot of code possibly here. Some divs and some other elements</li>
</ul>

我想或多或少地使用以下代码进行过滤。

var filter = $('#search_page_query').val(), count = 0;    

$(".sortable li").each(function () {

    if ($(this).text().search(new RegExp(filter, "i")) < 0) {
        $(this).fadeOut();


    } else {
        $(this).show();
        count++;
    }
});

但是，只有当列表项直接包含搜索关键字时才会有效。

事实并非如此。我应该用以下内容搜索列表项：

$(this + 'span').text()

但这当然是不正确的。但我不知道如何正确访问span内容。我希望任何人都可以告诉我它是如何完成的。

提前致谢

解决 @RameshKithsiriHettiArachchi

解决方案是

而不是：

$(this).text()

使用：

$(this).children('span').text()

完整代码：

var filter = $('#search_page_query').val(), count = 0;    

$(".sortable li").each(function () {

    if ($(this).children('span').text().search(new RegExp(filter, "i")) < 0) {
        $(this).fadeOut();


    } else {
        $(this).show();
        count++;
    }
});

Answer 1

选择当前DOM元素的子元素使用$(this).children()函数。

https://api.jquery.com/children/

Jquery .each迭代访问这个子内容

解决方案是

1 个答案: