javascript - 标签中的动态移除边框

Question

我必须画线，这将根据标签的选择而有所不同

. 看看我现在有什么：

看看我需要做什么：

我的主要问题是我不知道如何动态删除边框

：积极的。

请帮帮我。可能不仅仅是css和html吗？一些JavaScript？

这里的html代码：

  <div class="layout-vbox-panel-item padding-top" style="background: transparent;">
        <ul data-componentname="tabSet" data-role="tabset" class="k-reset k-tabset">
        <li class="k-tab k-active-tab" data-tabindex="0"><span class="k-item">Описание</span></li>
<li class="k-tab" data-tabindex="1"><span class="k-item">Обсуждение</span></li>
<li class="k-tab" data-tabindex="2"><span class="k-item">План</span></li>
<li class="k-tab" data-tabindex="3"><span class="k-item">Файлы</span></li>
<li class="k-tab" data-tabindex="4"><span class="k-item">История</span></li></ul>
    </div>

ul 的 css 在这里：

   .k-tabset {
display: block;
list-style-type: none;
line-height: 1.5;
overflow: none;
font-family: arial;
padding: 0px 3px;
white-space: nowrap;

此处为 li 的 css：

background-color: #F5F5F5;
border: 1px solid #C5C5C5;
border-bottom: 1px solid;
border-radius: 7px 7px 0 0;
color: rgb(192,192,192);
cursor: pointer;
display: inline-block;
font-weight: bolder;
list-style-type: none;
margin: 0 -1px 0 0;
position: relative;

对于李：活跃

background-color: #fff;
z-index: 1;
border-bottom: 1px solid #fff;

Answer 1

放

border:none 

在 CSS 中li:active

Answer 2

尝试

 li:active
{
 background-color: #fff;
  z-index: 1;
  border:none;//removed your border-bottom
}

Answer 3

试试这个小提琴http://jsfiddle.net/EXZax/，如果你使用的是基于 js 的标签导航

$(function(){
    $('ul.k-tabset').on('click','li.k-tab',function(){
        $('ul.k-tabset').find('li.k-active-tab').removeClass('k-active-tab');
        $(this).addClass('k-active-tab');
    });

});

如果您的标签正在重新加载页面。用这个

li.k-active-tab{
background-color: #fff;
z-index: 1;
border-bottom: 1px solid #fff;
}