问题listfilter仅在某些css类中

时间:2013-04-16 11:39:16

标签: jquery

我是jQuery的新手,需要帮助。我得到了这个代码,工作正常:

<script>
    (function ($) {
        // custom css expression for a case-insensitive contains()
        jQuery.expr[':'].Contains = function(a,i,m){
            return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;
        };

        function listFilter(header, list) { // header is any element, list is an unordered list
            // create and add the filter form to the header
            var form = $("<form>").attr({"class":"filterform","action":"#"}),
            input = $("<input>").attr({"class":"filterinput","type":"text"});
            $(form).append(input).appendTo(header);

            $(input).change( function () {
                var filter = $(this).val();
                if(filter) {
                    // this finds all links in a list that contain the input,
                    // and hide the ones not containing the input while showing the ones that do
                    $(list).find("a:not(:Contains(" + filter + "))").parent().slideUp();
                    $(list).find.hasClass(Lot) + ("a:Contains(" + filter + ")").parent().slideDown();
                } else {
                    $(list).find("li").show();
                }
                return false;
            }).keyup( function () {
                // fire the above change event after every letter
                $(this).change();
            });
        }

        //ondomready
        $(function () {
            listFilter($("#header"), $("#list"));
        });
    }(jQuery));
</script>

</head>
    <body>
        <div id="wrap">
            <h1 id="header">List of countries</h1>
            <ul id="list">
                <li>
                    <p class="Lot">1001</p>
            <p class="Desc para-style-override-1">
                        KARMAPA. Tibet, 19./20. Jh. H 14,8 cm.<br>Bronze.
                        Sitzender Lama in dhyanasana auf Lotosthron. Mit seiner rechten Hand 
                        ruft er die Erde als Zeugin an, während die Linke in Meditationsgestus 
                        ein Wassergefäss hält. Gewand mit eingraviertem Blumendekor.
                    </p>
            <p class="Footnote para-style-override-1">
                        Carl Laszlo collection, Basel.
                    </p>
            <p class="LotEst para-style-override-1">CHF 1 000.- / 1 500.-</p>
            <p class="Est2 para-style-override-1">(€ 830.- / 1 250.-) </p>
                </li>
                <li>
                    <p class="Lot">1002*</p>
            <p class="Desc para-style-override-1">
                        KLEINER AMITAYUS. Tibetochinesisch, 18./19. Jh. H 11 cm.<br>Bronze.
                        Der Buddha des ewigen Lebens sitzt in der Lotoshaltung auf einem 
                        Doppellotosthron. Fein gestaltetes Gesicht. Unverschlossen. Min. besch.
                    </p>
            <p class="LotEst para-style-override-1">CHF 500.- / 800.-</p>
            <p class="Est2 para-style-override-1">(€ 420.- / 670.-)</p>
                </li>
            </ul>

我只想过滤p class="Lot"中的数字,但要显示整个li

我尝试使用.hasClass,但它没有用。谢谢你的帮助。

1 个答案:

答案 0 :(得分:0)

 $(list).find.hasClass(Lot)

无法正常工作。没有定义Lot变量; - )

尝试

 $(list).find.hasClass("Lot")

使用jQuery按类选择元素的最简单方法是

$('.Lot',list);

你可以把它结合起来:

$(".Lot:Contains(" + filter + ")", list).parent().slideDown();

锻炼:http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery