回复:jQuery的多页复选框筛选复选框、多页、jQuery

2023-09-10 18:58:23 作者:九尾喵~

此问题是 jQuery的多页复选框过滤器的延伸。这正是我的问题。

This question is an extension of jQuery Multiple Checkbox Page Filter . It's my question exactly.

我有三个目标:

我想有复选框列表过滤页面内容。 我只想返回匹配所有的当前检查的内容 框,隐藏所有的休息。 如果未选中任何复选框,应有尽有 应该显示。 I want to have a list of check boxes to filter Page Content. I want to return only the content that matches all of the currently checked boxes, hiding all the rest. If no boxes are checked, everything should show.

由于$ P $在上面的问题pviously讨论,目标A和C.完成与:

As previously discussed in the above question, goals A and C were accomplished with:

$('div.tags').delegate('input:checkbox', 'change', function()
{
     var $lis = $('.results > li').hide();
     //For each one checked
     $('input:checked').each(function()
     {
          $lis.filter('.' + $(this).attr('rel')).show();
     });      
});

和目标B的完成有:

var selector = $('input:checked').map(function ()
{
    return $(this).attr('rel');
}).get().join('.');
$lis.filter(selector).doWhatever();

但我不知道如何这两个脚本集成在一起?

But I don't know how to integrate these two scripts together?

推荐答案

给这一个镜头:的http:// jsfiddle.net/mattball/tkLK6/

$('div.tags').delegate('input[type=checkbox]', 'change', function()
{
    var $lis = $('.results > li'),
        $checked = $('input:checked');

    if ($checked.length)
    {
        var selector = $checked.map(function ()
        {
            return '.' + $(this).attr('rel');
        }).get().join('');

        $lis.hide().filter(selector).show();     
    }
    else
    {
        $lis.show();
    }
});