javascript - 我怎样才能改变里面的内容以便它可以匹配当前单击的按钮？

Question

我正在尝试更改里面的内容，ul以便它可以匹配当前点击的内容button。

<div class="btns">
    <button class="active"></button>
    <button></button>
    <button></button>
</div>
<ul class="dynamiq_content">
    <li class="active"></li>
    <li></li>
    <li></li>
 </ul>

<script>
//variables 
     const ContentBtns = $(".btns button");
     const content = $(".dynamiq_content li");
//function 
    ContentBtns.on("click", function () {
          $(this).addClass("active").siblings().removeClass("active");
          content.addClass("active");
    });

</script>

标签： javascripthtmljqueryarraysfor-loop

Answer 1

试试这个：

 ContentBtns.on("click", function () {
      $(this).addClass("active").siblings().removeClass("active");
      var index = ContentBtns.index(this);
      content.removeClass("active").eq(index).addClass("active");


 });