Javascript 手风琴不'；不能正常打开

我有这个手风琴。除了开门，一切都好。当我按下一个按钮时，它会同时打开两个按钮。我只需要打开我点击的那个，当我第二次点击时，我想先隐藏。需要让它切换

当我将display:flex更改为column时，它可以正常工作，但在行中，它会在单击时同时打开。对我来说，它背后的逻辑是没有意义的

$（文档）.ready（函数（）{
$（'.accordion list>li>.answer'）.hide（）；
$（'.accordion list>li'）。单击（函数（）{
if（$（this）.hasClass（“活动”））{
$（this.removeClass（“active”）.find（“.answer”）.slideUp（）；
}否则{
$（“.accordion list>li.active.answer”）.slideUp（）；
$（“.accordion list>li.active”）.removeClass（“active”）；
$（this.addClass（“active”）.find（“.answer”）.slideDown（）；
}
返回false；
});
});
ul.accordion-list{
位置：相对位置；
显示器：flex；
弯曲方向：行；
宽度：100%；
高度：自动；
填充：20px；
保证金：0；
列表样式：无；
背景色：#f9f9fa；
}
美国手风琴协会{
位置：相对位置；
显示：块；
宽度：100%；
高度：自动；
背景色：#F36F20；
填充：20px；
保证金：0自动15px自动；
边框：1px实心#eee；
边界半径：5px；
光标：指针；
颜色：#fff；
}
ul.accordio-list li.active h3:after{
变换：旋转（45度）；
}
ul.手风琴列表li h3{
字号：700；
位置：相对位置；
显示：块；
宽度：100%；
高度：自动；
填充：0；
保证金：0；
字体大小：15px；
字母间距：0.01em；
光标：指针；
}
ul.手风琴列表李分区答案{
位置：相对位置；
显示：块；
宽度：100%；
高度：自动；
保证金：0；
填充：0；
光标：指针；
}
ul.手风琴列表li分区答案p{
位置：相对位置；
显示：块；
字体大小：300；
填充：10px0；
光标：指针；
线高：150%；
利润率：0.15px0；
字体大小：14px；
}




信息
KJKJ
kjjk
KJJKJ：
kjkjk
kjkjk：
kjkjk
kjkj：
KJKJ
KJKJ：
kjkjk
KJKJ
KJKJJJ，00欧元


第二
kjkj
KJKJK
jkkjk
kjkjlj
kjkljlk
jlklkjljk€
ljklkjljk：
20.12.2025

这是一个CSS问题。父级是flex，这就是为什么它在设置为
auto
时为li提供所有可用空间的原因。只需将li的高度设置为
fit content
或
min content
或
max content
：

ul.accordion-list li {
  height: fit-content;
}

这不是jQuery问题，而是CSS问题

我一直在JSFIDLE中进行实验，将LI的高度从auto更改为min内容似乎是可行的：

height: min-content;


禁用jQuery代码可以清楚地看到效果。
为
ul.accordion-list li
设置规则
margin bottom:auto
。此规则具有极好的跨浏览器兼容性

而且效果很好

应该是这样的:

ul.accordion-list li {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    background-color: #F36F20;
    padding: 20px;
    margin: 0 auto 15px auto;
    border: 1px solid #eee;
    border-radius: 5px;
    cursor: pointer;
    color: #fff;

    margin-bottom: auto;
}

尝试
each（）
method@sergeykuznetsovjquery运行良好。这是CSS问题。@PranavRustagi，好的，对不起。我给了你一个解决办法。检查。此jquery代码将不会产生相同的结果。为什么会有这样的结论？以您在类处于活动状态时单击li为例