Javascript-显示：“无”不起作用

当然，我正在尝试编写自己的非商业电子商店，但我对JavaScript和显示有一个问题：无。当我点击Log in acc_drop时，Log in acc_drop会将显示更改为block，但如果我点击关闭x，则不会发生任何事情。控制台显示acc_下降显示=无。我不知道我哪里出错了

谢谢你的回复

window.onload=函数{ 设acc=document.querySelector.acc； 让accdrop=document.querySelector.acc\u drop； 让closebtn=document.querySelector.close； acc.onclick=函数{ 如果accdrop.style.display=none{ accdrop.style.display=块； } } closebtn.onclick=函数{ accdrop.style.display=无； console.logaccdrop.style.display； } } .行政协调会{ 填充：10px； } 普里拉塞尼会计事务所{ 颜色：6B； 光标：指针； } .根据prihlaseni：悬停{ 文字装饰：下划线； } .附件.附件{ 显示：无； 位置：绝对位置； z指数：80000； 最高：80%； 左：50%； 转化：转化-50%，-50%； 背景色：F5； 盒影：0 5px 0； 宽度：260px； 高度：300px； 边界半径：5px； 文本对齐：居中； } .acc.acc_下降.关闭{ 位置：绝对位置； 排名：0； 右：0； 字体大小：11px； 颜色：F5； 背景色：9e1b1b； 边界半径：0 5px 0 5px； 填充物：5px； 光标：指针； } .附件附件下降.关闭：激活{ 背景色：5f0606； } .acc.acc_drop.login标题{ 边缘顶部：10px； 字号：8px； } .acc.acc_寄存表格{ 显示器：flex； 弯曲方向：立柱； 填充：10px； 文本对齐：左对齐； 保证金：0； } .acc标签{ 文本对齐：左对齐； 字体大小：9px； 字体大小：400； } .acc.acc_下降输入{ 宽度：100%； 高度：20px； 边缘顶部：8px； 大纲：无； 边框：1px实心6b； 边界半径：3px； 盒影：0 2px 00FFDD插图； } .acc.acc\u drop.loginform{ 边缘顶部：5px； } .acc.acc\u下拉输入：焦点，文本区域：焦点{ 盒影：0 0 7px 00FFDD； 边框：1px实心6b； } .acc.acc\U drop.注册{ 填充：10px； } .acc.acc\U drop.accbtn{ 高度：20px； 边缘顶部：10px； 边缘底部：5px； 边界：无； 背景色：6B； 边界半径：5px； 颜色：00FFDD； 字体大小：9px； 字号：600； 光标：指针； 大纲：无； } .附件附件a{ 颜色：6B； 文字装饰：下划线； 浮动：对； 字体大小：9px； } .附件附件a：悬停{ 文字装饰：无； } .acc.acc\U drop.reg:：之前{ 内容：； 显示：块； 边框底部：1px实心6b86； 宽度：100%； } .acc.acc\U drop.登记册p{ 边缘顶部：10px； 字体大小：10px； } .acc.acc_下降注册表按钮{ 高度：20px； 宽度：100%； 边缘顶部：5px； 边界：无； 背景色：9e1b1b； 边界半径：5px； 颜色：ffffff； 字体大小：9px； 字号：600； 光标：指针； 大纲：无； } .acc.acc_drop.accbtn:悬停{ 背景色：8686； 过渡：1s； } .acc.acc\U下降注册表按钮：悬停{ 背景色：e41919； 过渡：1s； } .acc.acc\U drop.accbtn:激活{ 背景色：4747； 过渡：无； } .acc.acc\ U drop.注册表按钮：激活{ 背景色：5a0b0b； 过渡：无； } Přihlásit se x 皮赫拉什尼 电子邮件* 赫斯洛* Přihlásit se 杰斯泰纳姆·泰切特

扎雷吉斯特罗萨酒店 closebtn位于acc内部。当您单击close时，事件气泡将返回，同时命中两个事件处理程序。您可以通过调用event.stopPropagation来避免这种情况：

此外，还应以不同的方式检查accdrop中的显示属性值。当您通过accdrop.style.display进行验证时，它将不会按预期工作，因为不会触发带有display:none的css类。它将仅验证VS style属性，而不验证其计算值：

   acc.onclick = function () {
        const accdropDisplayValue = window.getComputedStyle(accdrop)
                                          .getPropertyValue('display');

         if (accdropDisplayValue === "none") {
             accdrop.style.display = "block";
         }
    }

closebtn位于acc内部。当您单击close时，事件气泡将返回，同时命中两个事件处理程序。您可以通过调用event.stopPropagation来避免这种情况：

此外，还应以不同的方式检查accdrop中的显示属性值。当您通过accdrop.style.display进行验证时，它将不会按预期工作，因为不会触发带有display:none的css类。它将仅验证VS style属性，而不验证其计算值：

   acc.onclick = function () {
        const accdropDisplayValue = window.getComputedStyle(accdrop)
                                          .getPropertyValue('display');

         if (accdropDisplayValue === "none") {
             accdrop.style.display = "block";
         }
    }

问题在于acc.onclick内的if条件：

而不是com 对，您正在对值进行赋值：

if (accdrop.style.display = "none")

它应该是：

if (accdrop.style.display === "none")

问题在于acc.onclick内的if条件：

您不是在比较，而是在设定值：

if (accdrop.style.display = "none")

它应该是：

if (accdrop.style.display === "none")

---

还可以尝试仅在h1上注册事件

---

还可以尝试仅在h1上注册事件

试试这个： .行政协调会{ 填充：10px； } 普里拉塞尼会计事务所{ 颜色：6B； 光标：指针； } .根据prihlaseni：悬停{ 文字装饰：下划线； } .附件.附件{ 显示：无； 位置：绝对位置； z指数：80000； 最高：80%； 左：50%； 转化：转化-50%，-50%； 背景色：F5； 盒影：0 5px 0； 宽度：260px； 高度：300px； 边界半径：5px； 文本对齐：居中； } .acc.acc_下降.关闭{ 位置：绝对位置； 排名：0； 右：0； 字体大小：11px； 颜色：F5； 背景色：9e1b1b； 边界半径：0 5px 0 5px； 填充物：5px； 光标：指针； } .附件附件下降.关闭：激活{ 背景色：5f0606； } .acc.acc_drop.login标题{ 边缘顶部：10px； 字号：8px； } .acc.acc_寄存表格{ 显示器：flex； 弯曲方向：立柱； 填充：10px； 文本对齐：左对齐； 保证金：0； } .acc标签{ 文本对齐：左对齐； 字体大小：9px； 字体大小：400； } .acc.acc_下降输入{ 宽度：100%； 高度：20px； 边缘顶部：8px； 大纲：无； 边框：1px实心6b； 边界半径：3px； 盒影：0 2px 00FFDD插图； } .acc.acc\u drop.loginform{ 边缘顶部：5px； } .acc.acc_下拉输入：聚焦， 文本区域：焦点{ 盒影：0 0 7px 00FFDD； 边框：1px实心6b； } .acc.acc\U drop.注册{ 填充：10px； } .acc.acc\U drop.accbtn{ 高度：20px； 边缘顶部：10px； 边缘底部：5px； 边界：无； 背景色：6B； 边界半径：5px； 颜色：00FFDD； 字体大小：9px； 字号：600； 光标：指针； 大纲：无； } .附件附件a{ 颜色：6B； 文字装饰：下划线； 浮动：对； 字体大小：9px； } .附件附件a：悬停{ 文字装饰：无； } .acc.acc\U drop.reg:：之前{ 内容：； 显示：块； 边框底部：1px实心6b86； 宽度：100%； } .acc.acc\U drop.登记册p{ 边缘顶部：10px； 字体大小：10px； } .acc.acc_下降注册表按钮{ 高度：20px； 宽度：100%； 边缘顶部：5px； 边界：无； 背景色：9e1b1b； 边界半径：5px； 颜色：ffffff； 字体大小：9px； 字号：600； 光标：指针； 大纲：无； } .acc.acc_drop.accbtn:悬停{ 背景色：8686； 过渡：1s； } .acc.acc\U下降注册表按钮：悬停{ 背景色：e41919； 过渡：1s； } .acc.acc\U drop.accbtn:激活{ 背景色：4747； 过渡：无； } .acc.acc\ U drop.注册表按钮：激活{ 背景色：5a0b0b； 过渡：无； } Přihlásit se x 皮赫拉什尼 电子邮件* 赫斯洛* Přihlásit se 杰斯泰纳姆·泰切特

扎雷吉斯特罗萨酒店 试试这个： .行政协调会{ 填充：10px； } 普里拉塞尼会计事务所{ 颜色：6B； 光标：指针； } .根据prihlaseni：悬停{ 文字装饰：下划线； } .附件.附件{ 显示：无； 位置：绝对位置； z指数：80000； 最高：80%； 左：50%； 转化：转化-50%，-50%； 背景色：F5； 盒影：0 5px 0； 宽度：260px； 高度：300px； 边界半径：5px； 文本对齐：居中； } .acc.acc_下降.关闭{ 位置：绝对位置； 排名：0； 右：0； 字体大小：11px； 颜色：F5； 背景色：9e1b1b； 边界半径：0 5px 0 5px； 填充物：5px； 光标：指针； } .附件附件下降.关闭：激活{ 背景色：5f0606； } .acc.acc_drop.login标题{ 边缘顶部：10px； 字号：8px； } .acc.acc_寄存表格{ 显示器：flex； 弯曲方向：立柱； 填充：10px； 文本对齐：左对齐； 保证金：0； } .acc标签{ 文本对齐：左对齐； 字体大小：9px； 字体大小：400； } .acc.acc_下降输入{ 宽度：100%； 高度：20px； 边缘顶部：8px； 大纲：无； 边框：1px实心6b； 边界半径：3px； 盒影：0 2px 00FFDD插图； } .acc.acc\u drop.loginform{ 边缘顶部：5px； } .acc.acc_下拉输入：聚焦， 文本区域：焦点{ 盒影：0 0 7px 00FFDD； 边框：1px实心6b； } .acc.acc\U drop.注册{ 填充：10px； } .acc.acc\U drop.accbtn{ 高度：20px； 边缘顶部：10px； 边缘底部：5px； 边界：无； 背景色：6B； 边界半径：5px； 颜色：00FFDD； 字体大小：9px； 字号：600； 光标：指针； 大纲：无； } .附件附件a{ 颜色：6B； 文字装饰：下划线； 浮动：对； 字体大小：9px； } .附件附件a：悬停{ 文字装饰：无； } .acc.acc\U drop.reg:：之前{ 内容：； 显示：块； 边框底部：1px实心6b86； 宽度：100%； } .acc.acc\U drop.登记册p{ 边缘顶部：10px； 字体大小：10px； } .acc.acc_下降注册表按钮{ 高度：20px； 宽度：100%； 边缘顶部：5px； 边界：无； 背景色：9e1b1b； 边界半径：5px； 颜色：ffffff； 字体大小：9px； 字号：600； 光标：指针； 大纲：无； } .acc.acc_drop.accbtn:悬停{ 背景色：8686； 过渡：1s； } .acc.acc\U下降注册表按钮：悬停{ 背景色：e41919； 过渡：1s； } .acc.acc\U drop.accbtn:激活{ 背景色：4747； 过渡：无； } .acc.acc\ U drop.注册表按钮：激活{ 背景色：5a0b0b； 过渡：无； } Přihlásit se x 皮赫拉什尼 电子邮件* 赫斯洛* Přihlásit se 杰斯泰纳姆·泰切特

扎雷吉斯特罗萨酒店