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

时间:2015-07-10 03:06:16

标签: javascript jquery html css

当用户点击下拉菜单按钮(类.drop)时,带有.dropdown类的div应为display: inline;,当再次单击下拉菜单按钮时,带有.dropdown类的div应为{{1}我正在使用标志功能来实现此结果,但单击时它不会执行任何操作。没有旗帜就行。

display: none;

2 个答案:

答案 0 :(得分:2)

您可以使用jQuery在不同的CSS类之间切换。但是,您需要创建这两个类。如果您在两个不同的课程之间切换,您甚至不需要跟踪标记功能(我假设您的意思是它是否被切换)。

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

.none {
  display: none;
}

.toggleClass()函数的作用是将元素添加到元素中,如果它没有它,如果元素已经是元素的一部分,则删除它。

答案 1 :(得分:1)

您可以在 css()

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