开发者

Filter results by Class Title using jQuery

开发者 https://www.devze.com 2023-01-07 11:50 出处:网络
I\'m just starting to get a hang of this jQuery th开发者_Python百科ing, so bear with me. Essentially what I\'ve got going on is a list of items with classes like \"politicians\" \"entrepreuners\" et

I'm just starting to get a hang of this jQuery th开发者_Python百科ing, so bear with me.

Essentially what I've got going on is a list of items with classes like "politicians" "entrepreuners" etc that define the people in this list.

The goal being, that I can attach tabs on the top of the list that will filter the results of the list.

I understand I can use .filter() to find the list items with the class "politician" attached to it. But how do I hide (or attach display:none;, either or) to the list items that don't have the class 'politician'?

As I said, I'm quite new to this, so if you can be specific, that'd be great!

Thanks again!

-Judson

EDIT: Here is the code as of now:

    $("#politician_filter").click(
    function(){
        $('#people li :not(.politician)').hide();
    })
})


Try something like this:

$("#politician_filter").click( function( event ){
    event.preventDefault();
    $('ul#people li:not(.politician)').hide();
})

Edit: removed space between li and :not.

Here's a working fiddle.


This hides all li elements and then shows all the lis with .politician class.

$("#politician_filter").click(function(){
    $("#people li").hide().filter(".politician").show();
    return false; //since you're using a link, disable default action
}​);​
0

精彩评论

暂无评论...
验证码 换一张
取 消