Javascript 筛选列表<；李>；使用jquery

我想根据li中范围的内容筛选列表（显示/隐藏lis）。目前我有一些工作，但无论匹配发生在哪里，它都会过滤列表。我需要它是种子开始，所以只有当比赛发生在跨度的开始将显示，否则它将被隐藏

<li><img/><span>text</span></li>
<li><img/><span>other text</span></li>
<li><img/><span>other words</span></li>

谢谢

试试看

var value = $("#listcontainer ul#list input").val().toLowerCase();
if (value == '') {
    $('ul#list> li').show(); //show all, if nothing entered
} else {
    var $lis = $('ul#list > li:not(.plain)').filter(function () {
        return $.trim($(this).text()).toLowerCase().indexOf(value) == 0;
    });
    $('ul#list > li:not(.plain)').not($lis).hide();
    $lis.show();
} //.plain = li which contains the text input

---

即使你能做到这一点，你也会遇到各种各样的问题，比如转义括号等等

尝试更具可读性的方法

var value = $("#listcontainer ul#list input").val();
if(value == '') {
    $('ul#list> li').show();
} else {
    $('ul#list > li').each(function() {
        if($(this).text() == value) {
            $(this).show();
        } else {
            $(this).hide();
        }
    });
}

另外，要知道过滤是一种选择（尽管对于您的问题，我会选择上面的解决方案）。

尝试：

$('ul#list > li:not(.plain)').text(function(i, text) {
   var show = text.slice(0, value.length) === value;//starts with value
   $(this).toggle(show);//if starts with val show otherwise hide
});

这将检查每个li的文本是否以值开头，如果以值开头则显示，否则将隐藏它。

请尝试以下方法：

var value = $("#listcontainer ul#list input").val();
if(value == '') {
    $('ul#list> li').show(); //show all, if nothing entered
} else {
    $('ul#list > li').each(function() { $(this).toggle(
                                          $(this).find('span').text() == value); });

} 

---

谢谢你的帮助，看起来效果很好！谢谢你的帮助，我选择了上面的megawac答案。谢谢你的帮助，我选择了上面的megawac答案。谢谢你的帮助，我选择了上面的megawac答案。

var value = $("#listcontainer ul#list input").val();
if(value == '') {
    $('ul#list> li').show(); //show all, if nothing entered
} else {
    $('ul#list > li').each(function() { $(this).toggle(
                                          $(this).find('span').text() == value); });

}