如何删除当按钮被点击

Question

我需要当我点击一个按钮，从一个导航栏崩溃删除这个CSS部分CSS部分：

ul.nav li.dropdown:hover > ul.dropdown-menu { 
    display: block;  
} 

我想是这样的：

$("#toggleButton").click(function() 
{ 
    $(".navbar-collapse").remove("ul.nav","li.dropdown","ul.dropdown-menu"); 
}); 

但它不起作用。我想有一个响应式导航栏菜单，当它崩溃时从该视图中删除下拉菜单。

Answer 1

你只需要刚才设置的CSS属性display到none施加到ul元素.dropdown-menu类。

ul.nav li.dropdown:hover这里没有任何相关性，因为它们被用作元素定位符并且没有display:none应用于它们。

$("#toggleButton").click(function() 
{ 
    $('ul.dropdown-menu').css('display','none'); 
}); 

要删除整个CSS属性，

$("#toggleButton").click(function() 
{ 
    $('ul.dropdown-menu').removeAttr('style'); 
}); 

Answer 2

你试过removeClass了吗？

$(".navbar-collapse").removeClass("nav dropdown dropdown-menu"); 

如果你想从DOM

$(".nav, .dropdown, .dropdown-menu").remove(); 

Answer 3

删除元素有不止一种方法来做到这一点，但你可以通过更改CSS当你点击按钮

做以下是你将如何实现的：

$("#toggleButton").click(function() 
{ 
    $("ul.nav li.dropdown:hover > ul.dropdown-menu").css({"display": "none"}); 
}); 

Answer 4

试试这个：

$("#toggleButton").click(function(){ 
    $(".navbar-collapse").remove("ul.nav li.dropdown > ul.dropdown-menu"); 
});