jQuery - подсчитывает элементы с определенным классом внутри родительского элемента.

Question

Я получил эту структуру HTML:

<form>
    <input class="myTrigger" type="radio" value="1"/>
    <input class="myTrigger" type="radio" value="2"/>
    <fieldset>
        <ul class="class1">
            <li></li>
        </ul>
        <ul class="class2">
            <li></li>
        </ul>
    </fieldset>
    <fieldset>
        <ul class="class2">
            <li></li>
        </ul>
        <ul class="class2">
            <li></li>
        </ul>
    </fieldset>
</form>

В jQuery мне нужно пройти через каждый ul и скрыть те, которые не имеют класса myClass (который определенchecked radio .myTrigger) , тогда мне нужно проверить наличие пустых fieldset (то есть: fieldsets, где ни один ul не имеет класса myClass) и скрыть их целиком.

До сих пор я был в состоянии скрыть нужные ul, но не fieldsets.Вот что я получил:

function myFunction() {

        var myClass = "class"+($("radio:checked").attr("value"));
        var productGroup = $("form ul");

        $("form fieldset").each(function(index){

            groupCheck = 0;

            $.each(productGroup, function(index, obj){
                if($(obj).hasClass(myClass))
                    {
                        groupCheck += 1;
                        $(obj).show();
                    }
                else
                    {
                        $(obj).hide();
                    };
            })

            if (groupCheck == 0)
                {
                    $(this).hide();
                }
            else {
                    $(this).show();
                };

        });

    };
myFunction();
$(".myTrigger").change(myFunction);

Также на той же странице у меня есть другие скрипты, переключающие тот же ul ex: (legend).click(function(){$(this).siblings("ul").toggle();});, поэтому я не могу скрыть наборы полей, основанные на данных ul.скрыто уже.вместо этого мне нужно искать классы («myClass»), присутствующие или нет.

(то есть: пока маленький скрипт переключает ul только для удобства пользователя, «myFunction» должен отфильтровать ul инаборы полей, которые будут показаны на основе выбора «myTrigger».)

Answer 1

Нет необходимости в петлях;просто наведите на объекты, которые вы хотите показать / скрыть, с помощью соответствующих селекторов:

var myClass = 'class' + $('radio:checked:first').attr('value');

// Hide all the <ul>s
$('ul.' + myClass).hide();

// First, show all the fieldsets, in case any were hidden earlier
$('fieldset').show(); 

// Now hide the ones that don't have any visible <ul>s inside
$('fieldset:not(:has(ul:visible))').hide();