Question

我制作了一个下拉菜单，其中包含一个HTML输入/按钮和一些更多按钮作为下拉菜单项。只要悬停在主按钮上，菜单就会显示

.dropdown:hover .dropdown-content {
    display: block;
}

这是CSS中的悬停事件：

function showDropDown() {
    document.getElementById("ssid-dropdown").style.display = 'block';
}

function hideDropDown() {
    document.getElementById("ssid-dropdown").style.display = 'none';
}

隐藏的JavaScript代码以及稍后“应该”再次显示：

hideDropDown()

现在，只要我将鼠标悬停在主按钮上，就会正确显示下拉菜单。但是在选择项目时，即使没有悬停在项目之外，我也会调用hideDropDown()来隐藏菜单。

我通知一旦element.style { display: none; }函数被调用，Chrome的调试窗口的CSS窗口中就会添加以下内容：

hideDropDown()

我想，这是一种生成的CSS，因为我调用了element.stlye的JavaScript函数。但是，只要发生此from numpy.random import choice func_list = [function1, function2, function2] weights = [10,40, 50] choice(func_list, 1, p=weights)()，下拉菜单的悬停/显示就不再有效了。

有任何想法如何解决这个问题？

Answer 1

您可以创建名为hide的课程，然后添加下一个css：

.hide {
  display:none;
}

添加或删除此课程。这种方式非常简单

Answer 2

你好，亲爱的朋友，你可以简单地使用这样的jquery：

$(".dropdown").show()或$(".dropdown").hide()

如何正确隐藏我的HTML下拉菜单？

2 个答案: