Question

我在同一网页上显示了两次目录。当用户单击一个列表中的链接时，我想更改两个列表中相同链接的类。

我的代码在单击列表项时已经添加/删除了类，所以我只想匹配两个列表。因此，当第一个列表中的列表项1更改为类“.active”时，第二个列表中的列表项1也会更改。

链接到小提琴： http://jsfiddle.net/4b7ag69f/

<ul>
  <li><a href="#">List Item 1</a></li>
  <li><a href="#">List Item 2</a></li>
  <li><a href="#">List Item 3</a></li>
  <li><a href="#">List Item 4</a></li>
  <li><a href="#">List Item 5</a></li>
</ul>
<ul>
  <li><a href="#">List Item 1</a></li>
  <li><a href="#">List Item 2</a></li>
  <li><a href="#">List Item 3</a></li>
  <li><a href="#">List Item 4</a></li>
  <li><a href="#">List Item 5</a></li>
</ul>

Answer 1

这是单程

＆＃13;

.clicked {
  color: orange;
}

a {
  text-decoration: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li><a href="#">List Item 1</a></li>
  <li><a href="#">List Item 2</a></li>
  <li><a href="#">List Item 3</a></li>
  <li><a href="#">List Item 4</a></li>
  <li><a href="#">List Item 5</a></li>
</ul>
<ul>
  <li><a href="#">List Item 1</a></li>
  <li><a href="#">List Item 2</a></li>
  <li><a href="#">List Item 3</a></li>
  <li><a href="#">List Item 4</a></li>
  <li><a href="#">List Item 5</a></li>
</ul>

＆＃13;

awk -F\. '{print $1"."NR"."$2}' file

Ortho234.1.phy
Ortho671.2.phy
Ortho880.3.phy

＆＃13;

Answer 2

$('a').click(function() {
  $('a').removeClass('clicked');
  var index = $(this).closest("li").index();
  $("ul").each(function(){
    $($(this).find("li")[index]).find("a").addClass('clicked');
  });
});

Answer 3

您需要找到索引，然后使用nth-child()选择器将该类应用于其他列表：

  var index = $(this).parent().index() + 1;
  //$(this).addClass('clicked');
  $('ul li:nth-child('+index+') a').addClass('clicked');

jQuery：如何在不同列表中的相同位置选择两个列表项？

3 个答案:

jsFiddle