2014-09-30 2 views
0

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

<html> 

    <head> 
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 

    <script> 
    $(document).ready(function() { 
     $('ul li:eq(1)').each(function(){ 
      alert($(this).text()); 
     }); 
    }); 
    </script> 

    </head> 

    <body> 
     <ul> 
     <li>Test</li> 
     <li>Pop</li> 
     <li>Test</li> 
     </ul> 

     <ul> 
     <li>Test</li> 
     <li>Pop</li> 
     <li>Test</li> 
     </ul> 

     <ul> 
     <li>Test</li> 
     <li>Pop</li> 
     <li>Test</li> 
     </ul> 
    </body> 

</html> 

Я хочу, чтобы перебрать все уль-х и оповещает текстовое значение второй Li в каждом списке. Таким образом, приведенный выше код должен предупредить слово pop 3 раза. Тем не менее, он предупреждает только 1 раз.

Как правильно использовать eq в вышеуказанном случае?

ответ

2

Вам необходимо использовать :nth-child. Селектор :eq() возвращает элемент в пройденном индексе, в данном случае 1 против всех элементов, переданных ему

$(document).ready(function() { 
 
    $('ul li:nth-child(2)').css('color', 'red'); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>Test</li> 
 
    <li>Pop</li> 
 
    <li>Test</li> 
 
</ul> 
 

 
<ul> 
 
    <li>Test</li> 
 
    <li>Pop</li> 
 
    <li>Test</li> 
 
</ul> 
 

 
<ul> 
 
    <li>Test</li> 
 
    <li>Pop</li> 
 
    <li>Test</li> 
 
</ul>


Если вы хотите использовать :eq(), вам необходимо пройти фильтр в качестве второго фильтра уровня, как

$('ul').find('li:eq(1)').css('color', 'red')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<ul> 
 
    <li>Test</li> 
 
    <li>Pop</li> 
 
    <li>Test</li> 
 
</ul> 
 

 
<ul> 
 
    <li>Test</li> 
 
    <li>Pop</li> 
 
    <li>Test</li> 
 
</ul> 
 

 
<ul> 
 
    <li>Test</li> 
 
    <li>Pop</li> 
 
    <li>Test</li> 
 
</ul>

В этом случае сначала будет найти все 3 ul элементов, то будет итерация по каждым из них и будет вызывать .find('li:eq(1)') в каждом одном независимо друг от друга.

Смежные вопросы