Question

以下代码显示按下.select-plan-details时向下滑动的列（.select-plan-buy div）（其他列，如果打开，向上滑动）。

HTML：

<div class="select-plan-container">

<div class="select-plan-column">
  <div class="select-plan-buy select-plan-buy-starter">
  </div>
  <div class="select-plan-details select-plan-details-starter">
  </div>
</div>

<div class="select-plan-column">
  <div class="select-plan-buy select-plan-buy-level">
  </div>
  <div class="select-plan-details select-plan-details-level">
  </div>
</div>

<div class="select-plan-column">
  <div class="select-plan-buy select-plan-buy-levels">
  </div>
  <div class="select-plan-details select-plan-details-levels">
  </div>
</div>

</div>

JS：

  jQuery(".select-plan-buy").click(function () {
    jQuery('.select-plan-column .select-plan-details').slideUp();
    jQuery(this).next(".select-plan-details").slideToggle();
  });

现在，当我再次按.select-plan-buy时（.select-plan-details已经打开时），它会向上滑动，然后再向下滑动（当前列）。我怎么能这样做才能正常滑动？

Answer 1

您可以使用：

 jQuery('.select-plan-column .select-plan-details').not(jQuery(this).next(".select-plan-details")).slideUp();

Answer 2

jQuery(".select-plan-buy").click(function () {
    var objDetail=$(this).next(".select-plan-details");
    $('.select-plan-column .select-plan-details').not(objDetail).slideUp();
    objDetail.slideDown();
  });

Div向上滑动然后再向下滑动

2 个答案: