JQuery索引有一个类的LI的编号，然后计数另一个UL并分配一个类

Question

我有一个使用ul自定义的手风琴。我在顶部也有一个计数器，显示你在手风琴的哪个部分。例如1-2-3-4-5，它们会根据你所在的位置而高亮显示。

我试图获得具有'activeform'类的手风琴LI的索引，然后将'active'类分配给对应的计数器UL LI。

我已经做了很多寻找一个解决方案，但我不确定我是否得到了正确的。这肯定行不通!

任何帮助都将非常感激。

if($('.form-accordion li').hasClass('activeform')) {
                var number = $(this).index();
                if(number == $('.number-list li').index()) {
                    $('.number-list li').addClass('active');
                }
            }

Answer 1

我认为您遇到的问题是if处理程序中的this引用，而不是指li.activeform元素。另外，您的第二个if条件是错误的，因为它将为索引返回0。

你需要得到li.activeform的索引基于它的兄弟所以使用$('.form-accordion li.activeform').index()，然后使用它来获得正确的.number-list li元素

var idx = $('.form-accordion li.activeform').index();
if (idx >= 0) {
  $('.number-list li.active').removeClass('active'); //only if you want to remove the previous active class here
  $('.number-list li').eq(idx).addClass('active');
}

.active,
.activeform {
  color: green;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul class="form-accordion">
  <li>1</li>
  <li>2</li>
  <li class="activeform">3</li>
  <li>4</li>
</ul>
<ul class="number-list">
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
</ul>

Answer 2

尝试使用下面的eq:

var number = $('.form-accordion li.activeform').index();
$('.number-list li').eq(number).addClass('active');

Answer 3

试试这个

$('.number-list li').removeClass('active');
$('.number-list li:eq('+$('.form-accordion li.activeform').index()+')').addClass('active');