从选项卡栏隐藏选项卡

Hiding a tab from tab bar

本文关键字：选项 隐藏      更新时间：2023-09-26

HTML文件中的制表符代码如下

<div class="tabbable">  
    <ul class="nav nav-tabs">  
       <li class="active"><a href="#overview" >Overview</a></li>
       <li class=""><a href="#edit" >Edit Company</a></li>  
       <li class=""><a href="#site" >Manage Sites</a></li>  
       <li class=""><a href="#addManagerTag" class="addManager" >Managers</a></li>  
       <li class="" ><a href="#department" >Departments</a></li>  
       <li class=""><a href="#user" >Manage Users</a></li> 
   </ul>
</div>
谁能告诉我如何隐藏部门标签?它不应该出现在制表符

谢谢

试试，

$('div.tabbable ul.nav.nav-tabs li:has(a[href="#department"])').hide();
演示

如果你想在html中这样做，你可以使用:

 <li class="" style="display:none;" ><a href="#department" >Departments</a></li>

为department元素添加'id' 

<li id="department" class="" ><a  href="#department" >Departments</a></li>

然后添加脚本来隐藏它:

<script>
   $(document)ready(function(){
      $("#department").hide();
   });
</script>

使用CSS设置元素为hidden

h1.hidden {
    visibility: hidden;
}

这将隐藏元素，但空白仍然存在。

另一个选项是使用:

h1.hidden {
    display: none;
}

这将隐藏元素，并删除元素之前所在位置的空白。

像这样:

<div class="tabbable">  
    <ul class="nav nav-tabs">  
       <li class="active"><a href="#overview" >Overview</a></li>
       <li class=""><a href="#edit" >Edit Company</a></li>  
       <li class=""><a href="#site" >Manage Sites</a></li>  
       <li class=""><a href="#addManagerTag" class="addManager" >Managers</a></li>  
       <li class=""><a href="#user" >Manage Users</a></li> 
   </ul>
</div>
相关文章：