Verberg nie vereiste resultate deur filters nie

Question

Waar dit alles begin het: Ek het al een vraag oor filters hier gevra: Filterresultaat met jQuery of JS vanaf 'n bestaande waardestel

Probleem:
Aangesien die data van 'n ander bladsy af kom deur 'n form post, is alle waardes veronderstel om aanvanklik sigbaar te wees ...... Die gebruiker kan dus deur die data gaan, en indien nodig, het hy die voorreg om filters te gebruik om die vereiste uit te sorteer.

Wat laat my soos 'n treinwrak voelis dat die waardes (wat gefiltreer moet word) op die bladsy veronderstel is om standaard sigbaar te wees en dan wanneer die gebruiker op sê class="tv", alle ander div classes wat nie bevat nie tv moet wegkruip

Waar is ek vas ???
Ek het probeer om 'n jQuery uit te werk wat ek logies gedink het, maar die resultaat het my anders laat glo :(

Probleem met vorige vraag
My vorige vraag het gehelp om te filter ... maar die data was hide() Standaard ... ek het omgekeer nodig ....

Inspanning en vroetel ??
Viool : http://jsfiddle.net/logintomyk/r6g3k/1/

Html

<!-- filter checkboxes -->
    <input type="checkbox" id="wm" class="a" />WM
    <input type="checkbox" id="tv" class="a" />tv
    <input type="checkbox" id="ac" class="a" />ac
    <input type="checkbox" id="terrace" class="a" />terrace


    <br> <hr><br>

   <!-- Results to be filtered -->
    <div class="wm field">WM</div>
    <div class="tv field">TV</div>
    <div class="ac field">ac</div>
    <div class="terrace field">terrace</div>
    <div class="wm tv field">WM TV</div>
    <div class="wm tv ac field">wm tv ac</div>
    <div class="wm terrace field">wm terrace</div>
    <div class="tv field">tv</div>
    <div class="tv ac field">tv ac</div>

my noob jQuery

$(document).ready(function () {
     $('.field').show(); // to show values by default


    $(".a").change(function () {
        $('div').hide(); //hide before displaying
        $(':checkbox:not(:checked)').each(function() {
            $("." + this.id).hide(); //hide unchecked filter values
        });
    }).change();
}); 

Answer 1

Dit kan makliker wees

var puts = $('.a');//get checkboxes
var cans = $('.field');//get content
puts.on('change', function() {//when checkbox changes
    if (!puts.filter(':checked').length) {//if nothing's checked
        cans.show();//show it all
    } else {//if something's checked
        cans.hide();//hide all
        puts.filter(':checked').each(function() {//get checked
            $('.'+this.id+':hidden').show();//show if hidden
        });  
    }
});

het 'n vroetel gemaak: http://jsfiddle.net/filever10/f8vk2/

afbreek

puts is die merkblokkies

cans Is die inhoudblokke

As 'n merkblokkie -toestand verander, as daar tans niks gekontroleer word nie, wys dit alles. As daar iets gekontroleer word, verberg dit alle inhoudsblokke en toon enige een wat 'n klas het wat ooreenstem met die id van 'n gemerkte kassie. Dit wys net dinge wat weggesteek is, so dit hoef nie verskeie kere op inhoudblokke te werk wat op verskeie gekontroleerde vakke van toepassing is nie.