Question

我已经看过这个问题的一些迭代，但没有解决我的特定问题。

单击h3时会出现问题，触发器会在下面的链接列表上切换可见性。选择器和行为工作正常，显示隐藏的项目并正确隐藏其他项目。但是，一旦标题被点击一次，之后必须单击两次才能执行切换。这是一个小烦恼，但我想要一个解决方案。

因此，点击一个标题会在它关闭时将其向下滑动，如果它打开则向上滑动，分别添加和删除.active类......一切都很好。

单击另一个标题也会正常运行，隐藏打开的列表并打开单击的标题。

但如果您将返回转到先前打开但现已关闭的第一个标题，只需点击一下即可启动切换。必须再次点击它。

简而言之，这就是问题所在。我对页面代码的访问权限有限，因此大多数遍历选择都必须在jQuery中完成，标签已经存在。

这是有问题的页面： http://queensvw.com/documents/stackoverflow

这是jQuery：

$(document).ready(function() {
  function hideAll() {
    $('#minutes_highlights .date_heading').nextAll('.document_listing').slideUp();
  }

  hideAll();

  $('#minutes_highlights .date_heading').click(function() {
    if ($(this).hasClass('active')) {
      $(this).removeClass('active');
      $(this).nextUntil('hr').slideUp();
    } else {
      $(this).addClass('active');
      hideAll();
      $(this).nextUntil('hr').slideDown();
    }
  });
});

我尝试根据其他主题添加preventDefault()和setTimeout()。说实话，我不确定他们为什么会这么重要，因为我没有采用a，但他们并没有解决点击问题。

有关如何避免第二次点击的任何想法？

Answer 1

这是因为当您单击其他元素时，您不会删除活动类。现在，我无法证明这会起作用，因为我无法测试它，但我很确定你将else条件更改为：

else {
  $('.active').removeClass('active');
  $(this).addClass('active');
  hideAll();
  $(this).nextUntil('hr').slideDown();
}

它会起作用。

jQuery slideDown（）slideUp（）需要两次点击

1 个答案: