Question

我有两个无序列表，有点像：

<ul class="list1">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li class="current">Item 4</li>
    <li>Item 5</li>
</ul>

<ul class="list2">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>

目标是，使用jquery，识别哪个li用'current'类标记，然后在第二个列表中添加一个类到相应的li。我只是想不出怎么做。

感谢。

Answer 1

$('ul.list2 li:nth-child(' + $('ul.list1 li.current').index() + ')').addClass('current');

或者你可以让它变得不那么icky：

$('ul.list2 li').eq($('ul.list1 li.current').index()).addClass('current');

第二个，我更喜欢，现在我可以看到它们:-)这里的技巧是：

“eq”过滤器允许您根据索引从jQuery列表中选择一个元素;
“index”函数可让你找到相对于DOM中兄弟姐妹的元素索引

Answer 2

// Find the current item in the first list, remember its text
var textToMatch  = $('ul.list1 li.current').text();
// Loop through each li in the second list
$('ul.list2 li').each(function(index, domElement){
     var curr = $(domElement);
     // if the text matchs the first then add our class
     if(textToMatch == curr.text()){
          curr.addClass('NEWCLASS');
     }
 });

EDIT1：这是回答错误的问题，这个问题已经澄清了我会留在这里，因为它仍然很好看:)）

EDIT2：作为Per Flex，这是一个更好的方式来实现同样的事情，再次不是问题所在。

$('.list2 li:contains("' + // Find an li in list2 which contains
    $('.list1 li.current').text() + '")')  // the same text as the as the current li in list1
    .addClass("NEWCLASS"); // and add our new class to it

Answer 3

只需使用它：

var initialIndex = $('.list1 .current').index();
$('.list2 li').eq(initialIndex).addClass('current');

Answer 4

$('li.current + li').addClass('yourClass')

编辑：对问题的误解

var index = $.inArray($('li.current')[0],$('li.current').parent().children());
$('ul:eq(1) li:eq('+index+')').addClass('selected');

使用jquery匹配类

4 个答案: