Jquery搜索功能隐藏所有元素

时间:2013-11-04 17:54:58

标签: javascript jquery

我有一个小问题Jquery,我想过滤我的购物车上的“项目”,这个代码实际上过滤但它只显示“li”但不显示他们的子项目,我的意思是它隐藏了一切,只显示实际元件

我想要过滤而不隐藏他们的“子”元素, enter image description here

enter image description here

enter image description here

                <div class="section_wrapper">
                    <ul id="prod_list">
                        <li>                                  
                            <a href="#" >
                                <div>
                                    <h5>Asus Crossfire MotherBoard LGA 775</h5>
                                    <div>
                                        <ul>
                                            <li>64 bits</li>
                                            <li>Super</li>
                                        </ul>
                                    </div>
                                </div>
                            </a>

                        </li>   

Jquery代码:

function search_filter() {
    $('#busqueda').click(function() {
        if ($(this).val() == "Buscar...") {
            $(this).val("");
        }
    }).blur(function() {
        if ($(this).val() == "") {
            $(this).val("Buscar...");
        }
    }).on('input', function() {
        busca = $(this).val();

        $("#prod_list li").each(function() {
            var elem = $(this).children('a');
            var reg = new RegExp(busca, "i");
            if (reg.test(elem.text())) {
                if ($(this).is(':hidden')) {
                    $(this).fadeIn('fast').css("display", "block");                    
                }

            } else {

                $(this).fadeOut('fast');
            }
        });
    });
}  

1 个答案:

答案 0 :(得分:1)

这可能是因为在#prod_list中你有li&gt; a&gt; div> div> ul&gt;利

最后一个是失败的

if (reg.test(elem.text())) {

获得淡出也是如此。您只需执行

即可解决此问题
$("#prod_list > ul > li").each(function() {

相反。