javascript - 使用 contains 的 jquery 搜索无法正常工作

Question

我使用jquery从包含动态生成的元素的静态html页面进行搜索到目前为止我已经编写了这个脚本。当我搜索它时隐藏不包含的div，但是当我按退格键并使用空搜索文本框时div元素不包含回来吧

代码:

<script>
$(document).ready(function(){
    $('.searchtextbox').keyup(function(){
        searchedText = $('.searchtextbox').val();
        $(".grid:not(:contains('"+searchedText+"'))").hide();
        //I want here code to return back the div elements  
        //when i empty the text box using backpace.
    });
});
</script>

Answer 1

您需要先显示所有网格元素，然后再隐藏过滤掉的网格元素。您还应该检查是否存在搜索字符串，否则它将隐藏所有不包含“”的内容，即全部:

var $grid = $(".grid").show()
if( searchedText ) {
    $grid.filter(":not(:contains('"+searchedText+"'))").hide();
}