не удалось получить обработанный список в переменной jquery - PullRequest
Новая
       19

не удалось получить обработанный список в переменной jquery

1 голос
/ 24 апреля 2010

У меня есть список html 

<ol id="newlist">
        <li>Test
            <ol>
                <li>1</li>
                <li>2</li>
                <li>3</li>
            </ol>
        </li>
        <li>Another test
            <ol>
                <li>1</li>
            </ol>
        </li>
        <li>Cool Test
            <ol>
                <li>1</li>
                <li>2</li>
            </ol>
        </li>
    </ol>

Теперь я спрятал список, используя css ... 

        #newlist li {
            display:none;
            list-style: none;
        }

Я хочу отобразить список и только потомков, которые имеют более 1 потомков ...

вывод должен быть ... 

Test
   1
   2
   3
Another test
Cool Test
   1
   2

Я использовал jquery и смог получить вывод ...

код, который я использовал ... 

   $("ol#newlist > li").show();


            for (var i = 0; i < $("ol#newlist > li").length; i++)
            {
                if ($("ol#newlist > li:eq(" + i + ") ol > li").length > 1)

                $("ol#newlist > li:eq(" + i + ") ol > li").show();


            }

образец страницы здесь

Теперь я хочу, чтобы весь список был в одной переменной, как я могу получить список в переменной ... 

      var $li = $("ol#newlist > li");

но код 

      $li.add($("ol#newlist > li:eq(" + i + ") ol > li"));

не работает ...

образец страницы здесь

образец страницы был обновлен ... ответ должен быть .... 

     var $li = $("ol#newlist > li").add(
                    $('#newlist').children('li').children('ol').filter(function() {
                        return $(this).children().length > 1;
                    }).children()
            );
     $li.show();

или 

  var $li = $('#newlist').find('li').filter(function() {
                return ($(this).siblings('li').length );
            });
  $li.show();

как ответил patrik ...

Спасибо за помощь ...

Спасибо
Прадют
Индия

Ответы [ 2 ]

1 голос
/ 24 апреля 2010

Извините, если это не то, что вы ищете, но результат, который вы хотите, всегда показывает li, а его дочерний элемент ol скрыт, 

Test
   1
   2
   3
Another test
Cool Test
   1
   2

Но ваш css почему-то скрывает элементы li. 

#newlist li {
        display:none;
        list-style: none;
    }

Если вы вместо этого спрятали ol элементы 

#newlist ol {
    display:none;
}

Вы можете просто сделать фильтр и показывать их по мере необходимости. 

    $('#newlist').show().find('ol').filter(function() {
        return $(this).children().length > 1;
    }).show();

В противном случае, если вы не можете изменить свой CSS, вам нужно проделать немного больше работы, чтобы убедиться, что все отображается правильно.

Что-то вроде: 

$('#newlist').show().children('li').show().children('ol').filter(function() {
        return $(this).children().length > 1;
    }).children().show();

EDIT:

Возможно, есть несколько способов добавить то, что вы хотите, в коллекцию.

Вот один. Он захватывает все элементы li, а затем фильтрует их, так что сохраняются только те из них, которые имеют хотя бы одного брата.

Фильтр применяется и к элементам li верхнего уровня, но это нормально, поскольку их больше одного (у них есть братья и сестры). 

var $collection = $('#newlist').find('li').filter(function() {
    return ($(this).siblings('li').length );
});

$collection.show();

Поскольку filter() возвращает результат логического теста, выполнение 

return ($(this).siblings('li').length );

возвращает true, если длина больше 0.

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

0 голосов
/ 24 апреля 2010

Я использовал .each для запуска функции на каждом старом
Я думаю, это то, что вы пытаетесь сделать
надеюсь, это поможет! 

$("#newlist").show();
    var $li = new Array();
    $("#newlist > li").each(function(index){
        if($("> ol > li", $(this)).length > 1){
            $("> ol", $(this)).show();
            $("> ol > li", $(this)).each(function(){
                $li.push($(this));
            });
        } else {
            $("> ol", $(this)).hide();
        }   
    });

$($li).each(function(){
    alert($(this).text());
});
...