Question

我在.list1和.list2上有多个元素，.list2不可见，而.list1中的元素触发.list2中的元素。我不知道会有多少元素，所以我想使用循环来获得一些带有click事件的jQuery代码。但循环不起作用。我做错了什么？

<ul class="list1">
<li class="opt1">option1</li>
<li class="opt2">option2</li>
<li class="opt3">option3</li>
<li class="opt4">option4</li>
<li class="opt5">option5</li>

<ul class="list2">
<li class="opt1">option1</li>
<li class="opt2">option2</li>
<li class="opt3">option3</li>
<li class="opt4">option4</li>
<li class="opt5">option5</li>

for (var x = 1; x <= 5; x++){
  $(".list1 li.opt" + x).click(function() {
      $(".list2 li").removeClass("selected");   
      $(".list2 li.opt" + x).addClass("selected");
  });
}

Answer 1

尝试为此目的编写single event不要使用for循环，并使用.index()从list-2中抓取相关元素

$('.list1 li').click(function () {
    $('.list2 li').removeClass("selected").eq($(this).index()).addClass("selected");
});

jQuery toggleClass用于循环和var的多个元素

1 个答案:

DEMO