$ .slideUp（）不处理CSS“display：none”父元素中的元素

Question

我有一个我正在设计的网站，它有一些嵌套的DIV元素，我用它们来容纳可扩展的按钮。

用户点击一个按钮，它会展开以显示更多内容。

一切都很有效，直到我有一个父DIV内的DIV，其显示属性设置为＆＃34;无＆＃34;。

有没有办法强制jQuery .slideUp（）方法最小化可扩展按钮，无论它是否在显示器中：是否为父对象？

或者，我需要设置什么属性/属性才能使$ .slideDown（）在显示中设置的元素上正常工作：none父DIV？

Answer 1

如果父母有display:none;，那么在尝试滑动孩子之前，您需要先显示它。您可以使用show函数执行此操作。

$(divToSlide).parent().show();
$(divToSlide).slideUp();

根据评论，您也可以将display属性设置为'block'

$(divToSlide).parent().css("display", "block");
$(divToSlide).slideUp();

Answer 2

不要将slideUp（）应用于可扩展按钮，而是尝试将其“显示”值设置为“无”。

这样，当您应用.slideDown（）方法时，它会认为已使用.slideUp（）方法隐藏了该元素。

Answer 3

我遇到了完全相同的问题，所提到的解决方案都没有按照我预期的方式为我工作，因为有时我在应用show()功能时丢失了slideUp / slideDown动画。我的最终解决方案是使用回调函数直接应用样式：

$(divToSlide).slideUp(delay, function () {
    // When animation ends
    $(this).css('display', 'none');
});

这样我可以在不丢失动画的情况下获得相同的结果。