引导导航活动链接不起作用

Question

我试图使导航在活动div上处于活动状态，以下示例显示并隐藏了正确的div，但未将活动类添加到链接中：

的HTML

<div class="list-group" id="admin-list"> 
<a href="#add-user" data-toggle="tab" class="list-group-item"> Add a user </a> 
</div>

JS

$("#nav li a").on("click", navigation("#nav li"));

$("#admin-list a").on("click", navigation("#admin-list a"));

var foo = function(navigation) {
    $(navigation).removeClass("active"); //Remove any previously "active" li
    $("#home, #about, #contact", "#add-user").hide(); //Hide all "pages"
    $($(this).prop("href")).show(); //Show only the current target
    $(this).addClass("active"); //Set click a as active
};

Answer 1

我认为您的问题出在

($(this).prop("href")).show(); 

因为那不是有效的选择器。 如果您只是想获取当前链接，请像这样引用它：

$(this).show(); 

Answer 2

我做了两件事...我注释了prop href show行，并删除了.closest，发现现在可以将active作为类正确添加到a标签中。

这是我正在使用的小提琴：

http://jsfiddle.net/LWAmE/

（我没有添加引导程序，因为我不需要添加引导程序来测试代码）

$("#admin-list a").on("click", function(f){
f.preventDefault();

$("#admin-list a").removeClass("active"); //Remove any previously "active" a
$("#home, #about, #contact, #add-user").hide(); //Hide all "pages"
//$($(this).prop("href")).show(); //Show only the current target
$(this).addClass("active"); //Set click a as active
});