Jquery 单击div取消选中以隐藏结果过滤器

Jquery 单击div取消选中以隐藏结果过滤器,jquery,forms,list,checkbox,filter,Jquery,Forms,List,Checkbox,Filter,简单地说,我们的表单有4个复选框,其中包含筛选结果隐藏值 检查时 用新小提琴检查一下 如果选中“计算机”复选框,它将过滤并隐藏其结果 结果2,结果4为 ---- 结果1 结果3 ---- 然后,如果未选中,它将再次显示其结果 ---- 结果1 结果2 结果3 结果4 >>只需单击div Computers即可取消选中并执行相同的取消选中效果 隐藏其结果 你能帮忙吗 Jquery HTML 链接的语法为[链接文本]http://example.com@madshogo是的,如果不提供一些代码,你不

简单地说,我们的表单有4个复选框,其中包含筛选结果隐藏值 检查时 用新小提琴检查一下 如果选中“计算机”复选框,它将过滤并隐藏其结果 结果2,结果4为 ---- 结果1 结果3 ---- 然后,如果未选中,它将再次显示其结果 ---- 结果1 结果2 结果3 结果4 >>只需单击div Computers即可取消选中并执行相同的取消选中效果 隐藏其结果

你能帮忙吗

Jquery

HTML


链接的语法为[链接文本]http://example.com@madshogo是的,如果不提供一些代码,你不允许链接到JSFIDLE。我不太明白这个问题,你能更好地解释这个问题吗?我们编辑了一个问题,现在你们可以用简单的方式帮助提问了。1-点击div>取消选中输入>过滤结果,或者2-点击取消选中效果,就像正常的取消选中你们可以帮助@madshogo一样
 $(document).ready(function () {


    $(':checkbox').click(function() {
        if($(':checkbox:checked').length > 3){
            alert('you can not check more than 3 checkboxes');
            $(this).prop('checked',false);
        }
    });
  })



///// Filter Results
$('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('');
var $results =  $lis.hide().filter(selector) ;

        if($results.length > 0) {
            $('.no-results-found').remove();
            $results.show();
        } else {
            $('.results').append('<li class="no-results-found">No results found.</li>');
        }
    }
    else
    {
        $lis.show();
    }

//click to uncheck

$('#sso').on('click', function (ev) {
        $("#aa").prop("checked", false);
var $results =  $lis.show().filter(selector) ;
    });

});
    <div class="tags">
    <label><input id="ss" type="checkbox" rel="arts" /> Arts </label>
    <label><input id="aa" type="checkbox" rel="computers" /> Computers </label>
    <label><input type="checkbox" rel="health" /> Health </label>
    <label><input type="checkbox" rel="video-games" /> Video Games </label>
</div>
<p/><p/><hr/>
<div id="sso">Click to uncheck #Computers</div>
<p/><p/><hr/>


<ul class="results">
    <li class="arts computers">
        Result 1
    </li>
    <li class="video-games">
        Result 2
    </li>
    <li class="computers health video-games">
        Result 3
    </li>
    <li class="arts video-games">
        Result 4
    </li>
</ul>