当菜单在彼此之上展开时,我有一些代码最初会出现故障。
如果您在第一个菜单中选择选项二,则会出现第二个选项。如果您随后打开第一个菜单,您会看到它在打开时出现故障 - 几乎有类似快门的延迟。也许它与 z 索引设置有关,我不确定?
在 Firefox 和 chrome 中,没有(明显的)故障。在 safari 中,下面的代码段有一个小故障。
为什么会出现故障?
const selected = document.querySelectorAll(".selected");
const optionsContainer = document.querySelectorAll(".options-container");
for (let i = 0; i < selected.length; i++) {
selected[i].addEventListener("click", () => {
optionsContainer[i].classList.toggle("open");
selected[i].classList.toggle("open");
for (let j = 0; j < selected.length; j++) {
if (i != j && selected[j].classList.contains("open")) {
optionsContainer[j].classList.toggle("open");
selected[j].classList.toggle("open");
}
}
});
}
for (let i = 0; i < optionsContainer.length; i++) {
let optionsList = optionsContainer[i].querySelectorAll(".options");
for (let j …Run Code Online (Sandbox Code Playgroud)