使文本在它之后再次可见'It’s被一个按钮隐藏了

Making text visible again after it's been hidden by a button click

本文关键字：隐藏 按钮 一个 It 之后 文本      更新时间：2023-09-26

我目前有一个下拉按钮，用于显示新文本/隐藏旧标题。我目前已将我的代码设置为

$('a.btn-navbar').click(function(){
            $('header#header-top').css('height','');
            $('#headerContainer').css('height','');
             $('#headerText').css('visibility','hidden');
        });

当再次单击该按钮以隐藏下拉菜单按钮时，我该如何重新启用头文本？

我曾考虑过使用toggle，但我不能100%确定它是否有效，我认为最好征求意见。

编辑。我用.thoggle（）使它工作。我之前遇到的问题是，我为什么不使用它，是它与我需要的下拉按钮有点重叠。添加z索引：-1；允许我绕过这件事。

下面是一个例子：

$('a.btn-navbar').click(function(){
            $('header#header-top').css('height','');
            $('#headerContainer').css('height','');
             $('#headerText').toggle();
        });

尝试用三元运算符编写条件

$('a.btn-navbar').click(function(){
   var header = $('#headerText');
   header.css('visibility',header.css('visibility') === 'hidden' ? 'visible' : 'hidden');
});

或者使用.toggleClass（）、

用三元运算符写条件

.visible { visibility:visible; }
.hidden { visibility:hidden; }
$('a.btn-navbar').click(function(){
   var header = $('#headerText');
   header.toggleClass('hidden visible');
});

使用（：visible）选择器$（'a.btn-navbar'）.click（function（）｛

         if ( $("#headerText").is(":visible") ) 
          {
            $('header#header-top').css('height','');
            $('#headerContainer').css('height','');
            $('#headerText').hide();
          }else{
            $('#headerText').show();
         }
    });
相关文章：