时间戳

首页 > 解决方案 > JQuery Accordion，当你折叠一个手风琴时，它们都会折叠。我希望它只会折叠目标手风琴

jquery - JQuery Accordion，当你折叠一个手风琴时，它们都会折叠。我希望它只会折叠目标手风琴

问题描述

我有手风琴的 JQuery 代码，一切都很好，但是当你关闭一个手风琴时，所有的手风琴都关闭了吗？我想要它，所以如果他们单击关闭它，它只会关闭一个手风琴。建议？

jQuery(document).ready(function() {
  jQuery('.uc_shadow_accordion .uc_trigger-{{uc_id}}:first').addClass('active').next().show();
  jQuery('.uc_shadow_accordion .uc_trigger-{{uc_id}}').click(function() {
    if (jQuery(this).next().is(':hidden')) {
      jQuery(this).toggleClass('active').next().slideDown();
    } else {
      jQuery('.uc_shadow_accordion .uc_trigger-{{uc_id}}').removeClass('active').next().slideUp();
    }
    return false;
  });
});

标签： jquery

解决方案

更新你的else部分。使用jQuery(this).removeClass('active').next().slideUp();. 所以它只会关闭selected元素。

jQuery('.uc_shadow_accordion .uc_trigger-{{uc_id}}')将选择所有accordions这就是它关闭所有的原因。

jQuery(document).ready(function() {
  jQuery('.uc_shadow_accordion .uc_trigger-{{uc_id}}:first').addClass('active').next().show();
  jQuery('.uc_shadow_accordion .uc_trigger-{{uc_id}}').click(function() {
    if (jQuery(this).next().is(':hidden')) {
      //jQuery(this).toggleClass('active').next().slideDown();

      // You should use .addClass() instead of .toggleClass()
      // because when you click and it is already hidden then you want to make it active.
      // .toggleClass() will also work but it may cause conflicts.
      jQuery(this).addClass('active').next().slideDown();
    } else {
      jQuery(this).removeClass('active').next().slideUp();
    }
    return false;
  });
});

推荐阅读