Question

<div class="tab-pane active"></div>
<div class="tab-pane"></div>
<div class="tab-pane"></div>
<div class="tab-pane"></div>
<button id="action">Next Div</button>

我想添加＆＃34;有效＆＃34;通过单击#action按钮将class分类到下一个tab-pane div。即当我第一次点击#action按钮时，我的dom看起来像 -

<div class="tab-pane active"></div>
<div class="tab-pane active"></div>
<div class="tab-pane"></div>

当我第二次点击#action按钮时，dom看起来 -

<div class="tab-pane active"></div>
<div class="tab-pane active"></div>
<div class="tab-pane active"></div>
<div class="tab-pane"></div>

我怎么能在jQuery中做到这一点？

Answer 1

这应该有所帮助：

$('#action').click(function() {
  $('.tab-pane.active').next('div').addClass('active');
});

div {
  display: inline-block;
  width: 40px;
  height: 40px;
}
.active {
  background: orange;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="tab-pane active"></div>
<div class="tab-pane"></div>
<div class="tab-pane"></div>
<div class="tab-pane"></div>
<button id="action">Next Div</button>

找到类似类的下一个div。不是所有的兄弟班

1 个答案: