html - jquery搜索卡

Question

我想搜索卡片内的东西。所以我最初的想法是在单击搜索按钮后根据文本输入的值使用 show() 或 hide() 函数。

$(document).ready(function(){
        $("#delete").on("click",function(){
            var value = $("#search").val().toLowerCase();
            if($(".name").text().toLowerCase().indexOf(value) > -1){
                $(".name").parent().show()
            }
            else{
                $(".name").parent().hide()
            }
        });
    });

.name 类是一个段落标签，里面是 Bootstrap 卡片类中的对象名称。问题是当我测试它时，它隐藏了所有内容而不是显示一个对象。

示例：项目是机器人、瓶子、蛋糕。当我搜索“机器人”时，它没有显示机器人和瓶子卡，而是显示所有卡（非隐藏）但是当我搜索“z”时，它隐藏了所有正确的东西我认为这是因为在任何中都找不到“z”的单词，所以当其中一个单词中有“bot”时执行隐藏功能，它只显示每张卡片，因为隐藏功能被忽略了。

如何解决这个问题？谢谢，抱歉，如果这是一个不好的解释

标签： htmljquerysearchbootstrap-4