手风琴关闭问题

时间:2021-06-29 07:09:21

标签: toggle accordion auto-close

我正在尝试使用一些常见问题手风琴来做一个练习项目。基本上我想要实现的是当我点击一个手风琴时它会打开,当我再次点击它时它关闭,当一个手风琴打开时我点击另一个时,前一个关闭,所以只有一个手风琴处于活动状态。我设法单独进行,但我遇到了一个问题,我要么在单击时打开和关闭相同的一个,要么在单击另一个时它自动关闭。我怎么能两者兼得?

const questions = document.querySelectorAll('.faq');
const togglers = document.querySelectorAll('.toggle');

togglers.forEach((toggler) => {
    toggler.addEventListener('click', () => {
        removeActive();

        toggler.parentNode.classList.toggle('active');
    });
});

function removeActive() {
    togglers.forEach((toggler) => toggler.parentNode.classList.remove('active'));
}

这是我的 JS 代码,我真的不明白为什么 classList.toggle 在调用上面的 remove 函数时会丢失删除功能。

谁能用非常基本的业余方式解释一下?

提前致谢!

0 个答案:

没有答案