Question

我有一个下拉菜单的addEventListener，当我第一次点击它时会出现菜单，如果我再次点击它会正确消失。但是，之后如果我再试一次没有任何反应。如果我删除了if语句并在函数内部使用了一个简单的警报，它每次都有效，但这个if语句似乎很麻烦。

document.getElementById("menu").addEventListener("click",navigation);
function navigation() {
var navMenu = document.getElementById("navigation");
var list = document.getElementById("list");
if (navMenu.style.height == 0) {
    navMenu.style.height = "190px";
    list.style.display = "flex";
}
else {
    navMenu.style.height = "0";
    list.style.display = "none";
}
}

Answer 1

元素高度以像素为单位报告，因此更新像这样的代码应该有效。

if (navMenu.style.height === '0px') {

这是一个codepen http://codepen.io/anon/pen/ZOXAzd

Answer 2

在条件中，更改

if (navMenu.style.height == 0)

到

if (navMenu.style.height == '0px')

它应该有用。

Answer 3

我对此不确定，但您是否尝试= 0代替= '0'？

我希望这有所帮助，祝你好运。

addEventListener＆＃34;点击＆＃34;只使用if语句运行一次

3 个答案: