Question

我遇到以下代码的问题，其中没有可点击的标签。我希望在点击和其他非活动时激活标签。

    <html>
    <head>
       <script type="text/javascript">
        $('#myTab a').click(function (e) {
         e.preventDefault()
        $(this).tab('show')
        })
       </script>
    </head>
    <body>
     ...
     <ul class="nav navbar-nav" id="myTab">
       <li class="active"><a href="Home.aspx" data-toggle="tab">HOME</a></li>
       <li><a href="AboutUs.aspx" data-toggle="tab">ABOUT US</a></li>
       <li><a href="ContactUs.aspx" data-toggle="tab">CONTACT US</a></li>
       <li><a href="Searchjob.aspx" data-toggle="tab">SEARCH JOBS</a></li>
     </ul>     
     ...
    </body>
    </html>

Answer 1

试试这个，

<script type="text/javascript">
$('#myTab a').click(function (e) {
     e.preventDefault();
    $(this).tab('show');

     //removing active class from other selected/default tab
    $("#myTab .active").removeClass("active");

    //adding active class to current clicked tab
    $(this).parent().addClass("active");
});
</script>

这是 jsFiddle Demo

Answer 2

使用如下所述的脚本：

$('#myTab li').click(function() {
    $('#myTab li').each(function() {
        $(this).removeClass('active');
    });

    $(this).addClass('active');

})

如何激活点击标签和非活动默认值？

2 个答案: