JQuery фильтрация по почте

Question

У меня есть страница архива, которая показывает пользовательские сообщения, каждая из которых имеет div, который показывает термины таксономии сообщения (пользовательские категории 'jobtype') в виде div следующим образом:

<div class="hidden tags category1 category2 cat3 etc..."></div>

ТогдаУ меня есть форма с флажками, каждое из которых имеет значение, соответствующее некоторым возможным категориям, которые могут иметь сообщения:

<input class="filterbox" type="checkbox" name="interest" value="academia" />Academia<br />
<input class="filterbox" type="checkbox" name="interest" value="adminassistant" />Admin/Assistant<br />
<input class="filterbox" type="checkbox" name="interest" value="communicationsmarketing" />Communications/Marketing<br />
<input class="filterbox" type="checkbox" name="interest" value="development" />Development<br />

Я хочу использовать jQuery для фильтрации (читай: $('.postclass').hide();) текущих сообщений на основефлажки выбраны.В настоящее время я использую следующий код jQuery:

var $checkboxes;

function storecat() {         
    var tags = $checkboxes.map(function() {
        if(this.checked) return this.value;
    }).get().join(' ');
    $('#selected-interests').html(tags); 
}

$(function() {
    $checkboxes = $('.filterbox:checkbox').change(storecat);
});

$('#filtersubmit').click(){

}

И это тупой пример того, как выглядит запись поста на странице категории:

<div class="post_entry">
    <div class="post-thumb"></div>
    <h4 class="post-title"><a href="#" title="Title">Title</a></h4>
<div class="post-meta">
    <p class="post_meta_organization">Job Organization</p>
        <p class="post_meta_location">City, State</p>
        <p class="post_meta_url">Website: <a href="#">Click Here</a></p>
    </div>
    <div class="hidden tags early-career internship other web-developmentit"></div>
    <p class="post_excerpt">Post Content Here</p>
</div>

Я думаю, что мне нужносделать $('.post_entry').each(); для проверки против var tags, но я не совсем уверен, с чего начать.Я думаю, что мне нужно создать массив тегов (сейчас они создают список?) И создать массив классов в <div class="hidden tags..."></div>

Я хочу, чтобы он скрывал сообщения, которые неУ него нет релевантных тегов, но отображаются только сообщения, в которых выбраны все теги.Если кто-то может помочь с моей функцией .each(), это будет высоко оценено.

Если вы хотите проверить больше макета, перейдите к http://www.cirkut.net/wp/libertyguide/jobs

Если какая-либо дополнительная информациянеобходимо, пожалуйста, спросите.

ПОДРАЗДЕЛ:

Как будут отображаться все сообщения, если НЕ выбраны входные данные?Я не опубликовал это как новый вопрос, потому что нахожу это очень важным для этого вопроса.

Если у меня есть кнопка отправки <input id="filter_submit" value="FIND" />

, и я изменяю jQuery на

$('#filter_submit').click( function() {
    $('.tags').parent().hide();
    $('input:checked').each( function(i) {
    $('div.' + $(this).val()).parent().show();
});

Когда я нажимаю кнопку отправки, все сообщения скрываются.Любая помощь?

Answer 1

Будет ли это то, что вы ищете: http://jsfiddle.net/3qwty/1/

$('input').click( function() {
    $('.tags').hide();
    $('input:checked').each( function() {
        $('div.' + $(this).val()).show();
    });
});

В настоящее время установлено отображение только выбранных элементов, но вы можете перевернуть его, чтобы скрыть выбранные элементы (т. Е. http://jsfiddle.net/3qwty/2/).

).

EDIT:

Похоже, вы могли скрывать контейнерный дивизион post-meta, и в этом случае вы могли бы сделать это: http://jsfiddle.net/3qwty/3/, который скрывает родительский контейнер

$('input').click( function() {
    $('.tags').parent().show();
    $('input:checked').each( function() {
        $('div.' + $(this).val()).parent().hide();
    });
});

РЕДАКТИРОВАНИЕ ПОДПРОСА:

Изменено, чтобы «повторно показывать» все сообщения, когда все флажки сняты: http://jsfiddle.net/3qwty/8/

$('input').click( function() {
    $('.tags').parent().hide();
    $('input:checked').each( function() {
        $('div.' + $(this).val()).parent().show();
    });
    if (!$('input:checked').length) $('.tags').parent().show();
});

Answer 2

Возможное решение - скрыть все сообщения с классом "post_entry", а затем показать только те, которые имеют все выбранные категории:

$(".post_entry").hide().filter(".category1.category2.categoryN").show();

jquery filter () с классами, перечисленными без пробелов, дает пересечение выбранных элементов; если вы хотите объединение (элементы хотя бы с одной категорией), используйте фильтр с ".category1, .category2, .categoryN"