我有一个下拉菜单。我添加了一个javascript addevent监听器，用于在单击某个选项时关闭下拉内容。它工作得很好。

JavaScript

const element = document.querySelector(".dropdown-content");


element.addEventListener("click", () => {
    
    element.style.display ="none";
    
}); 

const element = document.querySelector(".dropdown-content");


element.addEventListener("click", () => {
    
    element.style.display ="none";
    
}); 

CSS

const element = document.querySelector(".dropdown-content");


element.addEventListener("click", () => {
    
    element.style.display ="none";
    
}); 

问题:

我面临的问题是，当下拉内容在单击时关闭时，它不会再次打开，而是保持关闭状态。

我尝试的内容:

再次单击下拉菜单时，我尝试将显示更改为阻止，但似乎不起作用。

const element = document.querySelector(".dropdown-content");


element.addEventListener("click", () => {
    
    element.style.display ="none";
    
}); 

顺晟科技：

可以使用'MouseEnter'和'MouseLeave'事件。

Kirill贴出的答案是正确的，但是在我添加这段代码时，它运行得非常好

const element = document.querySelector(".dropdown-content");


element.addEventListener("click", () => {
    
    element.style.display ="none";
    
});