如何使用jQuery的标志交换CSS显示属性

Question

当用户点击一个下拉菜单按钮（class .drop）时，带有class .dropdown的div应该为display: inline;，并且当下拉菜单按钮被再次点击时，该div将与class。下拉应display: none;我正在使用标志功能来实现这个结果，但点击时它不会做任何事情。它将在没有国旗的情况下运作。

<script> 
    $(".drop").on('click', function(){ 
     $('.dropdown').css('display', flag ? 'inline' : 'none'); 
    }); 
</script> 

Answer 1

可以在css()

<script> 
    $(".drop").on('click', function(){ 
     $('.dropdown').css('display', function(i,v){return v=='none' ? 'inline' : 'none' }); 
    }); 
</script> 

Answer 2

您可以使用jQuery在不同的CSS类之间切换。但是，您将需要创建两个类。如果你在两个不同的类之间切换，你甚至不需要跟踪标志特征（我假设你是指它是否被切换）。

$(".drop").on('click', function(){ 
    $('.dropdown').toggleClass('inline none'); 
}); 

.inline { 
    display: inline; 
} 

.none { 
    display: none; 
} 

什么.toggleClass()功能确实是特定类添加到元素，如果没有它，如果它已经是元素的一部分，将其删除。